---
id: bd7158d8c242eddfaeb5bd13
title: Build a Personal Portfolio Webpage
isRequired: true
challengeType: 3
videoUrl: ''
localeTitle: قم ببناء صفحة الويب الشخصية للحافظة
---

## Description
<section id="description"> <strong>الهدف:</strong> إنشاء تطبيق <a href="https://codepen.io" target="_blank">CodePen.io</a> تشبه وظيفيًا هذا: <a href="https://codepen.io/freeCodeCamp/full/zNBOYG" target="_blank">https://codepen.io/freeCodeCamp/full/zNBOYG</a> . تحقق من <a href="https://en.wikipedia.org/wiki/User_story" target="_blank">قصص المستخدمين</a> أدناه واجتاز جميع الاختبارات. اعطها اسلوبك الشخصي. يمكنك استخدام HTML و JavaScript و CSS لإكمال هذا المشروع. يوصى باستخدام CSS العادي لأن هذا هو ما غطته الدروس حتى الآن ، ويجب أن تحصل على بعض التمرين باستخدام CSS عادي. يمكنك استخدام Bootstrap أو SASS إذا اخترت. لا يوصى باستخدام هذا النوع من التقنيات الإضافية (على سبيل المثال jQuery أو React أو Angular أو Vue) ، ويكون استخدامها على مسؤوليتك الخاصة. سوف تعطيك مشاريع أخرى فرصة للعمل مع مكدسات التكنولوجيا المختلفة مثل React. سنقبل ونحاول إصلاح جميع تقارير المشكلات التي تستخدم مجموعة التكنولوجيا المقترحة لهذا المشروع. الترميز سعيدة! <strong>قصة المستخدم رقم 1:</strong> يجب أن يكون لحقيدي قسم ترحيبي به معرف <code>welcome-section</code> . <strong>قصة المستخدم رقم 2:</strong> يجب أن يحتوي قسم الترحيب على عنصر <code>h1</code> يحتوي على نص. <strong>قصة المستخدم رقم 3:</strong> يجب أن يكون لحافظة أعمالي قسمًا للمشروعات يحتوي على معرف <code>projects</code> . <strong>قصة المستخدم رقم 4:</strong> يجب أن يحتوي قسم المشاريع على عنصر واحد على الأقل يحتوي على فئة من <code>project-tile</code> المشروع لعقد مشروع. <strong>قصة المستخدم رقم 5:</strong> يجب أن يحتوي قسم المشروعات على رابط واحد على الأقل لمشروع. <strong>قصة المستخدم رقم 6:</strong> يجب أن تحتوي حافظتي على شريط تنقل به معرف <code>navbar</code> . <strong>قصة المستخدم رقم 7:</strong> يجب أن يحتوي شريط التنقل على رابط واحد على الأقل يمكنني النقر عليه للانتقال إلى أقسام مختلفة من الصفحة. <strong>قصة المستخدم رقم 8:</strong> يجب أن تحتوي محفظتي على رابط بمعرّف <code>profile-link</code> ، الذي يفتح ملفي الشخصي على GitHub أو FCC في علامة تبويب جديدة. <strong>قصة المستخدم رقم 9:</strong> يجب أن تحتوي حافظتي على استعلام وسائط واحد على الأقل. <strong>قصة المستخدم رقم 10:</strong> يجب أن يساوي ارتفاع قسم الترحيب ارتفاع إطار العرض. <strong>قصة المستخدم رقم 11:</strong> يجب أن يكون شريط التنقل دائمًا في أعلى منفذ العرض. يمكنك بناء مشروعك عن طريق <a href="http://codepen.io/freeCodeCamp/pen/MJjpwO" target="_blank">تسجيل قلم CodePen هذا</a> . أو يمكنك استخدام رابط CDN هذا لتشغيل الاختبارات في أي بيئة تفضلها: <code>https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js</code> بمجرد الانتهاء ، أرسل عنوان URL إلى عملك مشروع مع كل اختباراتها تمر. تذكر استخدام طريقة <a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck/19514" target="_blank">Read-Search-Ask</a> إذا واجهتك مشكلة. </section>

## Instructions
<section id="instructions">
</section>

## Tests
<section id='tests'>

```yml
tests: []

```

</section>

## Challenge Seed
<section id='challengeSeed'>

</section>

## Solution
<section id='solution'>

```js
// solution required
```
</section>
