GraphQL & Apollo & React & Nodejs БЫСТРЫЙ КУРС FullStack приложение

• GraphQL описывает, как запрашивать данные и используется клиентом для загрузки данных с сервера.  

• В отличие от HTTP, GraphQL позволяет запрашивать только нужные данные, избегая избыточного объема.  

• Основные понятия GraphQL: схема, кэри, мутации и подписки.  

• Создание папок для сервера и клиента.  

• Инициализация проекта с использованием npm и установка необходимых зависимостей.  

• Написание скрипта для запуска проекта в режиме разработки.  

• Импорт и настройка Express для запуска сервера.  

• Импорт и настройка GraphQL для работы с сервером.  

• Создание схемы для GraphQL и описание типов данных.  

• Описание типа пользователя и его полей.  

• Создание типа поста и его полей.  

• Описание мутаций для создания и изменения объектов.  

• Описание типа запроса для получения всех пользователей и конкретного пользователя.  

• Создание резолвера для обработки запросов.  

• Имитационное хранение данных в массиве для тестирования запросов.  

• В реальном приложении будут запросы к базе данных.  

• Создан резолвер и передан в граф кля-шти-типи.  

• Тестируем запросы, добавляя объект с полями айди, юзернейм и возраст.  

• Используем ключевое слово кверри для получения данных.  

• Клиент сам выбирает, какие данные получать.  

• Создаем мутацию крейт юзер для добавления пользователей.  

• Функция крейт юзер генерирует айдишник и возвращает объект с айди и импутом.  

• Исправляем ошибку в мутации и добавляем пользователя в базу данных.  

• Создаем пользователя с постами, указывая массив объектов.  

• Пишем запрос на получение пользователей с постами.  

• Получаем пользователей с постами и указываем поля для получения.  

• Разворачиваем React-приложение с помощью утилиты create-react-app.  

• Используем Apollo для отправки запросов и кэширования.  

• Импортируем необходимые модули и создаем объект клиента.  

• Связываем клиент с приложением и начинаем разработку функционала.  

• Создаем форму с импута для имени пользователя и возраста.  

• Создаем состояние для хранения списка пользователей.  

• Отрисовываем пользователей с помощью функции мэп.  

• Создаем папку для запросов и файл для получения пользователей.  

• Используем функцию джек для преобразования строки запроса.  

• Применяем хук useQuery для выполнения запросов и сохранения данных в состояние.  

• Проверяем данные и обновляем состояние только при наличии данных.  

• Использование поля "лоудинг" для создания крутилки.  

• Синхронные запросы и спиннеры.  

• Создание папки-файла и мутации для создания пользователей.  

• Указание параметров мутации с использованием знака доллара.  

• Описание параметров и типов данных.  

• Возвращение данных в компоненте.  

• Создание функций для изменения состояния импутов.  

• Добавление слушателей событий onChange.  

• Оживление импутов и создание функции для создания пользователя.  

• Использование хуков useQuery и useMutation.  

• Передача переменных в мутацию.  

• Деструктуризация и вывод данных в логи.  

• Обновление страницы и добавление пользователя в массив.  

• Использование хука useRefetch для обновления данных.  

• Добавление пользователя в список.  

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

• Передача параметров и получение данных.  

• Использование именованной деструктуризации.  

• Использование фрагментов для повторного использования данных.  

• Пример с возвратом пользователя и его данных.  

• Заключение и благодарность за просмотр.