Продовжуємо роботу у файлі `fonts.ts`. Імпортуйте шрифт `Rubik` з вагою `400` та підмножиною `latin`. Застосуйте цей шрифт до елемента `p` у файлі `app/page.tsx`.

Для завершення використання шрифтів розкоментуйте компонент `TradeHubLogo` у файлі `app/page.tsx` та перевірте сторінку у режимі реального часу.

Має відображатися наступний вигляд нашого застосунку.

Навчіться створювати сучасні високопродуктивні вебзастосунки з використанням Next.js. Налаштовуйте проєкти зі структурованими макетами, стилізацією та маршрутизацією для безшовної навігації. Ефективно отримуйте та відображайте дані, оптимізуючи рендеринг і продуктивність. Реалізуйте розширені функції, такі як пагінація, CRUD-операції та глобальний пошук для динамічних вебзастосунків. Розгортайте свої проєкти Next.js, підключайте їх до баз даних і додавайте автентифікацію для захисту даних користувачів.

Обговорення необхідних попередніх знань перед початком роботи з фреймворком Next.js, очікувань від курсу та проєктів, які будуть створені.

Ми налаштуємо проєкт, розглянемо способи додавання стилів до нашого застосунку та охопимо візуальні аспекти, такі як зображення, шрифти, сторінки й макети.

Дізнайтеся, як легко створювати та керувати новим поданням для вашого застосунку й здійснювати навігацію між усіма сторінками за допомогою вбудованої системи маршрутизації.

Розгортання додатка Next.js за допомогою облікових записів GitHub і Vercel. Додатково — налаштування бази даних для забезпечення додатка необхідними даними.

Розгляд способів отримання та чіткого й ефективного відображення даних для користувача.

Дізнайтеся, як впроваджувати сучасні веб-функції, такі як пагінація, CRUD-операції, глобальний пошук, валідація форм та інше.

Реалізація автентифікації у Next.js.

Завдання: Впровадження Користувацького Шрифту Google

На практиці