Модуль 40

Архітектура production-рівня та фінальний проєкт

Ось готовий урок, створений спеціально для тебе у стилі CS50. Пристебни паски, ми починаємо занурення в реальний світ розробки! 🚀


🎓 УРОК: Архітектура production-рівня та твій Фінальний Проєкт

Привіт, світе! 👋 Це CS50 (або майже він), і сьогодні ми виходимо за межі "лабораторних умов".

1. 🔥 Вступ: Чому "працює у мене" — це не аргумент?

Уявімо ситуацію. Ти написав свій фінальний проєкт. Це веб-сервіс, скажімо, для замовлення піци 🍕. Ти запускаєш його на своєму ноутбуці, відкриваєш localhost:5000 — все літає! Картинки вантажаться, замовлення падають у базу даних. Ти щасливий.

Ти кличеш друга і кажеш: "Заціни!". Скидаєш йому посилання... на localhost. І, звісно, у нього нічого не відкривається. Ти виправляєшся, деплоїш (розміщуєш) проєкт на найдешевший сервер, кидаєш лінк у груповий чат університету.

Заходить 100 людей одночасно. І що стається? 💥 Сервер "лягає". База даних зависає. Паролі від адмінки раптом стають видимі в коді сторінки.

Чому? Тому що код, який працює, і система, яка живе — це різні речі.

Риторичне запитання: Чи погодились би ви жити в хмарочосі, який збудували за тими ж принципами, що й будку для собаки? Напевно, ні. Хоча і там, і там є стіни й дах.

Сьогоднішня мета: Перетворити твій проєкт із "будки для собаки" (домашнього завдання) на "хмарочос" (Production-ready архітектуру).

Аналогія: Кухня 🍳

  • Student Project: Ти готуєш яєчню вдома. Ти сам собі кухар, офіціант і прибиральник. Якщо впала виделка — ти її підняв і помив.
  • Production: Це кухня ресторану Michelin. Тут є цехи (холодний, гарячий), шеф-кухар (Load Balancer), чіткі інструкції (протоколи) і запасні генератори на випадок відключення світла.

2. 🧠 Теоретична база: Що під капотом "великих" систем?

Давайте розберемо, що відрізняє професійну архітектуру. Не лякайся термінів, логіка тут проста.

А. Розподіл відповідальності (Separation of Concerns)

У твоєму першому коді, ймовірно, все було в одному файлі: і HTML, і SQL-запити, і логіка. У Production ми це ріжемо на шари: 1. Frontend (Клієнт): Те, що бачить користувач (вітрина магазину). 2. Backend (Сервер): Мозок, який обробляє дані (склад і менеджери). 3. Database (База): Сейф, де лежить інформація.

Інтуїтивно: Якщо прорвало трубу в туалеті ресторану, кухарі на кухні не перестають готувати. Так само помилка на фронтенді не повинна вбивати базу даних.

Б. Масштабованість (Scalability)

Коли приходить багато людей, у нас є два шляхи: 1. Вертикальна: Купити потужніший сервер (як найняти Халка замість вантажника). Це дорого і має межу. 2. Горизонтальна: Купити 10 звичайних серверів і розподілити навантаження (як найняти 10 звичайних вантажників). Це шлях Google, Facebook і твого фінального проєкту в ідеалі.

В. Environment Variables (Змінні середовища)

⚠️ Запам’ятай назавжди: Ніколи, чуєш, НІКОЛИ не пиши паролі, API-ключі чи секретні токени прямо в коді (hardcoding). Якщо ти заллєш пароль від бази даних на GitHub — вважай, що твій проєкт вже зламали майнери криптовалют. Ми використовуємо .env файли, які не потрапляють у репозиторій.


3. 🧪 Приклади: Еволюція архітектури

Подивімося, як це виглядає на практиці.

Рівень 1: "Моноліт-початківець" (Твій ноутбук)

# app.py
def get_users():
    # Пряме підключення з паролем у коді (ЖАХ! 😱)
    db = connect("host=localhost, pass=12345") 
    return db.query("SELECT * FROM users")

# Тут же і HTML генерується
print("<h1>" + get_users() + "</h1>")

Чому це погано? Якщо база впаде — впаде все. Якщо зміниш пароль — треба переписувати код.

Рівень 2: "Production-ready Monolith"

Ти розділив код. У тебе є файл конфігурації.

# config.py
import os
DB_URL = os.getenv("DATABASE_URL") # Пароль береться з оточення сервера!

# app.py
from database import get_users_list
from views import render_template

def show_users():
    users = get_users_list() # Логіка бази окремо
    return render_template("users.html", data=users) # Відображення окремо

Що змінилося? Безпека! Читабельність!

Рівень 3: "Архітектура Великих Хлопців" (Спрощено)

Уяви схему: 1. Load Balancer (Регулювальник): Зустрічає запит користувача. 2. Server 1 / Server 2 / Server 3: Регулювальник кидає запит туди, де вільніше. 3. Redis (Кеш): Пам’ять для швидких даних (щоб не смикати базу зайвий раз). 4. Database Cluster: Головна база для запису + копії для читання.

Запитання до тебе: Якщо Server 1 згорить, чи помітить це користувач у цій схемі? Відповідь: Ні! Load Balancer просто перенаправить запит на Server 2. Це називається High Availability (Висока доступність).


4. 🛠 Практична частина

Час закачати рукави! Ось твої завдання для підготовки фінального проєкту.

🔹 Завдання 1: "Чистка секретів"

Перевір свій поточний код. * Знайди будь-які паролі, ключі API або адреси баз даних. * Створи файл .env і перенеси їх туди. * Додай бібліотеку (наприклад, python-dotenv для Python або dotenv для Node.js) і змусь код читати змінні звідти. * Важливо: Додай .env у .gitignore!

🔹 Завдання 2: "Тест на автобус" (Bus Factor)

Уяви, що ти забув, як працює твій код, або тебе "збив автобус" (метафорично!), і проєкт перейшов іншому розробнику. * Напиши файл README.md. * Там має бути одна команда, яка запускає твій проєкт (наприклад, docker-compose up або npm start). Якщо для запуску треба танцювати з бубном 15 хвилин — це погана архітектура.

🔹 Завдання 3: "Що, якщо..."

Подумай і напиши на папері рішення: * Що буде з твоїм додатком, якщо база даних відповідатиме 10 секунд замість 0.1 секунди? (Користувач бачитиме білий екран чи спіннер завантаження?) * Як ти дізнаєшся, що сталася помилка, якщо ти спиш? (Тобі потрібні Logs).

🔹 Міні-кейс:

Твій додаток дозволяє завантажувати аватарки. Ти зберігаєш їх у папці images/ прямо на сервері. * Проблема: Ми переходимо на хмарну архітектуру, і сервери будуть створюватися і знищуватися автоматично. Якщо сервер знищиться, зникнуть і картинки. * Рішення: Куди треба перенести збереження файлів? (Підказка: AWS S3, Google Cloud Storage, окремий файловий сервер).


5. 💡 Мислення як у розробника

Як відрізнити новачка від профі?

❌ Новачок думає: * "Воно працює, не чіпай." * "Я буду сам слідкувати за сервером 24/7." * "Якщо щось зламається, я швидко пофікшу на проді."

✅ Досвідчений інженер (Ти) думає: * "Що може піти не так?" (Murphy's Law). * "Як автоматизувати перевірку помилок?" * "Код має бути нудним." Так, нудним! Передбачуваним. Сюрпризи хороші на дні народження, а не в п'ятницю ввечері на сервері.

Порада Девіда: Не намагайся побудувати Google за один день. Почни з простого модульного моноліту. Але пиши код так, ніби завтра його доведеться масштабувати. Тримай логіку чистою.


6. 🧩 Підсумок

Сьогодні ми не просто писали код. Ми вчилися проектувати системи.

Що ти тепер розумієш: 1. Локалхост ≠ Продакшн. 2. Секрети — у змінні оточення. 3. Розділяй і володарюй: фронтенд, бекенд і база — це друзі, але живуть у різних квартирах. 4. Твій фінальний проєкт має бути стабільним, як швейцарський годинник, а не як картковий будиночок.

🔮 Тизер наступної теми: Тепер, коли ми знаємо, як будувати архітектуру, постає питання: як доставити код на сервер автоматично, щоб не копіювати файли вручну через FTP? Наступного разу поговоримо про CI/CD (Continuous Integration / Continuous Delivery) і магію автоматизації!

А поки що... це був CS50. Успіхів з фінальним проєктом! 🎬