Homework 10 - Final: Fonts, Adaptive, Deploy

[vladyslav-yermolin-moc]

Підготовка

Як зазвичай, початок розробки нової функціональності (нового завдання) відбувається з актуальної версії продакшена (гілка main).

1. Перемкніться на гілку main та завантажте найновішу версію з нашого репозиторію.
2. Заведіть нову гілку під назвою 10-final_<ім'я користувача github>.
3. Скопіюйте ваш проєкт у теку docs, переназвіть її <ім'я користувача github> та додайте посилання на ваш проєкт в index.html. Таким чином, коли ментор змерджит ваш пр, ваша задеплоїна версія не буде затирати попередню задеплоїну версію

• приклад index.html
• приклад теки із проєктом у папці docks, на яку веде посилання з індексу
  Всю подальшу роботу над проєктом робіть у цій папці

Копіювати можна руцями, або командой. Тут я привожу команду для мак-ос, для віндовса це команда copy

cp  -R lectures/5-logic/ docs/vladyslav.yermolin

Ціль

Після виконання цього завдання у вас буде ваш проєкт, задеплоїний на GitHub Pages. По ньому ваш ментор буде його перевіряти, та давати добро на здачу іншому ментору, який буде робити фінальну перевірку проєкту.

Завдання

1. Додаємо шрифти з вашого проєкту
2. Додаємо футер
3. Додаємо адаптив. За допомогою медіа-запитів, робимо так, щоб ваш сай виглядав нормально для будь-якого розширення екрана (верстка не ломалася). Для легкого варіанта можна зафіксувати ширину конетнта, щоб появлявся горізонтальний скролл

Завдання з *

1. Зробіть резінову верстку:

• мінімальна ширина контенту - 400px (меньше - зʼявляється скрол)
• весь контент розміщен по центру
• картки, елементи хедера, футера, фільтри, вишукуються в колонку
• на сторінці About текст розміщується під картинкою

Деплой

По бажанню можна деплоїти не на GitHub Pages. Тоді весь цей блок можна скіпнути. Основна вимога - посилання на працюючий проєкт в пул-реквесті

Деплой на GitHub Pages

Для того, щоб ментор міг подивитися ваш проєкт, його треба десь опубліковати. В розробці це називається тестовий енвайрмент, або stage. Ви створите свій стейдж, клонуванням репозиторію MA на GitHub. В результаті ви отримаєте свою копію репозиторію, де ви можете робити, що заманеться (наприклад видалити все та запушити в main👹)

1. Склонуйте репозіторій
   

2. Додайте його як ще один ремоут репозіторій до вашого локального проєкта
   

git remote add my [email protected]:vladyslav-yermolin-moc/fe-course-basic-2023.git
git remote -v

Тепер у вас 2 репозіторія - origin(загальний для всіх студентів) & my(ваш приватний)

5. Запуште вашу гілку(10-final_<ім'я користувача github>) у ваш репозіторій

git push my

6. Налаштуйте деплой вашого проєкта з вашої гілки, з теки docs- документація
   

7. Перевірте, чи все задеплоїлось нормально. Для цього пройдіть за посиланням від GitHub Pages. Для мене це https://vladyslav-yermolin-moc.github.io/fe-course-basic-2023/
   

8. Зробіть пуллреквест в main із посиланням на ваш задеплоїний проєкт 10 final v.yermolin #422

• Це можна робити як раніше, запушив свою гілку у репозіторій МА, та зробити пр "в середині" його

git push origin

• Або це можна зробити з вашого репозиторію на GitHub
  

9. Тепер, кожен раз, щоб побачити свої зміни у своїй задеплоїній версії, вам треба пушити зміні з вашої локальної гілки у ваш репозиторій на GitHub

10. Після мерджу вашого пр, ви повинні побачити свої зміни у нас на проді