Ось урок, створений спеціально за твоїм майстер-промптом. Уяви, що ти сидиш у лекційній залі Гарварду (або дивишся трансляцію в YouTube), я ходжу сценою в чорній футболці, і ми починаємо!
🎓 CS50: Моделі, Сесії та CRUD. Як веб «пам'ятає» тебе?
Привіт, світе! Радий вас бачити. 👋
Сьогодні ми зануримось у те, що перетворює звичайну веб-сторінку на повноцінний додаток. Ми поговоримо про пам’ять.
1. 🔥 Вступ: Проблема амнезії
Уявіть, що ви приходите в кав’ярню. Ви замовляєте еспресо. Бариста киває, ви відходите. Через хвилину ви повертаєтесь до стійки й питаєте: «Де моя кава?». А бариста дивиться на вас порожніми очима і каже: «Ви хто? Я вас вперше бачу».
Ви знову замовляєте. Він знову киває. Ви відвертаєтесь, повертаєтесь — і він знову вас не пам’ятає.
Звучить як нічний жах? Але саме так працює інтернет за замовчуванням.
Протокол HTTP (мову, якою спілкуються браузер і сервер) називають stateless — він не має стану. Кожен ваш клік, кожне оновлення сторінки — це для сервера абсолютно нова подія. Він не знає, що це той самий користувач, який щойно ввів логін.
Риторичне питання: Якби Instagram працював так само, вам довелося б вводити пароль перед кожним лайком. Зручно? Навряд чи.
Тому нам потрібно розв'язати дві фундаментальні проблеми: 1. Короткострокова пам'ять: Як серверу впізнати вас, поки ви гуляєте сайтом? (Це Сесії). 2. Довгострокова пам'ять: Де зберігати ваші пости, лайки та коментарі, щоб вони не зникли, коли ви закриєте браузер? (Це Моделі та Бази даних).
Без цього ми б досі читали статичні HTML-сторінки з текстом. Тож поїхали розбиратися!
2. 🧠 Теоретична база: Під капотом
Давайте розкладемо це на прості механізми.
🏛 Що таке Модель? (Model)
Уявіть, що База Даних (БД) — це величезна Excel-таблиця. Писати SQL-запити до неї вручну (наприклад, SELECT * FROM users...) — це як керувати автомобілем, смикаючи за тросики під капотом. Можна, але складно і брудно.
Модель — це ваше «кермо» і «педалі». Це клас у вашому коді (на Python, PHP чи JS), який відображає таблицю в базі даних.
* Таблиця має колонки: id, username, password.
* Модель має поля: self.id, self.username, self.password.
Ми працюємо з об'єктами, а Модель сама перекладає це в SQL. Це називається ORM (Object-Relational Mapping).
📌 Запам’ятати: Модель — це джерело істини про ваші дані.
🍪 Що таке Сесія? (Session)
Повернемось до кав’ярні. Щоб бариста вас не забував, він видає вам номерок або чек. Коли ви підходите за кавою, ви показуєте чек. Бариста звіряє номер чека зі своїм записом і віддає замовлення.
В вебі це працює так: 1. Сервер дає вам Cookie (маленький текстовий файл, «номерок»), який браузер зберігає. 2. Сесія — це запис на сервері (у «журналі баристи»), де написано: «Власник номерка 123 — це Андрій, і він уже залогінився».
💡 Інтуїтивно: Cookie — це ваш квиток у кишені. Сесія — це запис у комп’ютері охорони, який каже, що цей квиток дійсний.
🛠 Що таке CRUD?
Це чотири вершники управління даними. Будь-яка програма (від Instagram до банківського додатку) робить лише ці 4 речі: * Create (Створити) — запостити фото. * Read (Читати) — подивитися стрічку. * Update (Оновити) — відредагувати підпис. * Delete (Видалити) — видалити ганебний комент.
3. 🧪 Приклади: Від простого до реального
Уявімо, ми будуємо «Список справ» (ToDo List) для студентів.
Приклад 1: Створення Моделі (Креслення)
Як ми пояснимо програмі, що таке «Завдання»?
# (Умовний синтаксис на базі SQLAlchemy/Python)
class Task(db.Model):
id = db.Column(db.Integer, primary_key=True) # Унікальний номер
content = db.Column(db.String(200)) # Текст завдання
is_done = db.Column(db.Boolean, default=False) # Чи зроблено?
def __repr__(self):
return f'<Task {self.id}: {self.content}>'
Питання до вас: Чому нам обов'язково потрібен id? Чому не шукати просто за текстом завдання?
(Пауза...)
Відповідь: Бо ви можете створити два завдання «Купити молоко». Як програма зрозуміє, яке з них ви викреслили? id — це унікальність.
Приклад 2: CRUD у дії
Тепер давайте спробуємо покерувати даними.
A) Create (Створити): Ми хочемо додати задачу «Зробити домашку CS50».
new_task = Task(content="Зробити домашку CS50")
db.session.add(new_task) # Додали в "кошик"
db.session.commit() # Натиснули "Зберегти" в базі
Без commit() нічого не збережеться! Це як написати лист, але не кинути в скриньку.
B) Read (Читати): Хочемо побачити всі задачі.
all_tasks = Task.query.all()
# Результат: [<Task 1: Зробити домашку CS50>]
C) Update (Оновити): Зробили домашку! Треба відмітити.
task = Task.query.get(1) # Знайшли по ID
task.is_done = True # Змінили статус
db.session.commit() # Знову коміт!
D) Delete (Видалити): Набридло вчитися (жарт). Видаляємо.
task = Task.query.get(1)
db.session.delete(task)
db.session.commit()
Приклад 3: Сесія (Магія впізнавання)
Уявіть код входу на сайт:
# Коли користувач вводить правильний пароль:
session["user_id"] = user.id
# Сервер: "Ага, запам'ятаю, що поточний браузер належить користувачу з ID 5"
# На наступній сторінці:
if "user_id" in session:
print(f"Привіт, користувач {session['user_id']}!")
else:
print("Ви хто? Увійдіть, будь ласка.")
Тут ми кладемо дані в «кишеню» сервера, прив'язану до конкретного браузера. Якщо ви відкриєте цей сайт в режимі Інкогніто — магія зникне, бо там немає того самого Cookie.
4. 🛠 Практична частина
Час забруднити руки кодом! (Умовно або в реальному IDE).
Завдання 1: Повторення
У вас є модель Task. Допишіть рядок коду, який створить завдання "Купити піцу".
Завдання 2: Зміна умов
До нашої моделі Task потрібно додати поле priority (пріоритет), яке може бути числом від 1 до 5. Як виглядатиме цей рядок коду в класі моделі?
Завдання 3: Виправи помилку Студент написав код для зміни тексту завдання, але в базі даних нічого не змінилося. Чому?
task = Task.query.get(5)
task.content = "Новий текст"
# Програма завершилась...
(Підказка: чогось не вистачає в кінці)
Завдання 4: Міні-кейс
Ви робите блог. У вас є модель Post (стаття) і модель User (автор).
Спроектуйте на папері: як зробити так, щоб видалити статтю міг тільки її автор?
(Підказка: вам треба використати і Сесію, і Модель).
Завдання 5: А що, якщо... Що станеться з даними сесії (наприклад, кошиком покупок), якщо користувач зайде на сайт з телефону, а до цього сидів з ноутбука? Чому?
5. 💡 Мислення як у розробника
Як думають профі, коли проектують це?
-
Не довіряй
sessionсліпо.- Помилка новачка: Зберігати в сесії важливі дані (наприклад, баланс користувача).
- Як треба: В сесії зберігаємо лише
idкористувача. Баланс беремо з Бази Даних (Моделі) в реальному часі. Чому? Бо сесію можна підробити або вона може застаріти.
-
Думай про «Зв'язки» (Relationships).
- Світ не складається з окремих таблиць. Користувачі мають Завдання. Завдання мають Категорії.
- Коли ви створюєте Модель, одразу питайте: «Кому це належить?».
-
Fat Model, Skinny Controller (Товста модель, худий контролер).
- Це золоте правило. Не пишіть складну логіку обробки даних у тому місці, де обробляється маршрут (URL). Перенесіть логіку в методи Моделі. Хай код буде чистим.
6. 🧩 Підсумок
Отже, що ми сьогодні розібрали?
- HTTP — забудькуватий. Без нашої допомоги він не пам'ятає нічого.
- Сесії — це тимчасова пам'ять (оперативка) для ідентифікації користувача.
- Моделі та БД — це довготривала пам'ять (жорсткий диск) для зберігання інформації.
- CRUD — це 4 дії, на яких тримається весь інтернет.
Тепер ви вмієте не просто показувати картинки, а зберігати історію. Ви можете створити систему реєстрації, блог або магазин.
👀 Тизер: Але зараз наші сторінки перезавантажуються щоразу, коли ми щось додаємо в базу. Це виглядає трохи «старомодно», як у 2005 році. Як зробити так, щоб дані оновлювались миттєво, без перезавантаження сторінки, як у чаті Telegram? На наступному уроці ми познайомимось із JavaScript та AJAX. Це буде справжня магія динаміки!
А поки що — це був CS50. Побачимось! 🎬