--- id: bd7158d8c242eddfaeb5bd13 title: Створіть веб-сторінку персонального портфоліо challengeType: 3 forumTopicId: 301143 dashedName: build-a-personal-portfolio-webpage --- # --description-- **Мета:** Створити [CodePen.io](https://codepen.io) застосунок, який за своїми функціями нагадує цей: . Заповніть [ історії користувачів ](https://en.wikipedia.org/wiki/User_story), розміщені нижче, і отримайте доступ до всіх тестів, які потрібно пройти. Виконайте завдання у власному стилі. Ви можете використати HTML, JavaScript, and CSS для виконання цього проєкту. Рекомендовано використовувати звичайний CSS, тому що саме про це розповідається на уроках і вам варто попрактикуватися зі звичайним CSS. Якщо обираєте Bootstrap або SASS, можете користуватися ними. Не бажано використовувати додаткові технології (наприклад: jQuery, React, Angular або Vue), в іншому разі, це лише під вашу власну відповідальність. Під час роботи над іншими проєктами ви зможете попрацювати з різними технологічними стеками, як-от React. Ми візьмемо до уваги і спробуємо виправити всі звіти, що використовують запропонований технологічний стек у цьому проєкті. Вдалого програмування! **Історія користувача #1:** На моєму портфоліо повинен бути розділ-вітання з наступним id `welcome-section`. **Історія користувача #2:** Розділ для вітання повинен містити елемент `h1` з текстом. **Історія користувача #3:** На моєму портфоліо повинен бути розділ з проєктами з id `projects`. **Історія користувача #4:** Розділ з проєктами повинен містити щонайменше один елемент класу `project-tile` для зберігання проєктів. **Історія користувача #5:** Розділ з проєктами повинен містити щонайменше одне посилання на проєкт. **Історія користувача #6:** На моєму портфоліо повинна бути навігаційна панель з id `navbar`. **Історія користувача #7:** Навігаційна панель повинна містити щонайменше одне посилання, завдяки якому ми могли б перейти на інші розділи сторінки. **Історія користувача #8:** На моєму портфоліо повинно бути посилання з id `profile-link`, завдяки якому можна перейти на мої профілі GitHub і FCC у новій вкладці. **Історія користувача #9:** На моєму портфоліо повинен бути щонайменше один медіа-запит. **Історія користувача #10:** Висота розділу з вітанням повинна збігатися з висотою вікна перегляду. **Історія користувача #11:** Навігаційна панель повинна розміщуватися у верхній частині вікна перегляду. Ви можете створити проєкт за допомогою using this CodePen template й натиснути `Save` для створення власного фрагмента. Або ж ви можете скористатися цим CDN посиланням для проходження тестів у будь-якому комфортному для вас середовищі:`https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js` Після завершення прикріпіть URL-адресу із пройденими тестами до проєкту, над яким працюєте. # --solutions-- ```html // solution required ```