udemy
Udemy - одна из самых больших площадок в мире по доставке обучающего контента от разных авторов всего мира. Присутсвуют курсы практически на любую тему.
Gatsby - Генератор статических сайтов для React - Полное руководство
Gatsby - Static Site Generator For React - Complete Guide
Продолжительность
7 ч 13 мин
Категория
React.js
Количество уроков
38 Видео
Дата добавления
19 янв. 2019 г., 11:36
Язык
Английский
Дата выхода
1 янв. 2019 г., 17:37
Дата обновления
31 янв. 2019 г., 09:31
Создавайте потрясающие сверхбыстрые веб-сайты с помощью React и GraphQL, начинайте работу со стеком JAM и подходом Headless CMS. В этом курсе вы узнаете, как создавать удивительные и сверхбыстрые статические веб-сайты с помощью Gatsby.js. Gatsby - это невероятно быстрый современный генератор сайтов для React.
Gatsby использует мощную предварительную конфигурацию для создания веб-сайта, который использует
- статические файлы для невероятно быстрой загрузки страниц,
- service workers,
- разделение кода,
- рендеринг на стороне сервера
- интеллектуальная загрузка изображений,
- оптимизация assets,
- и предварительная выборка данных.
Gatsby поставляется с мощной системой плагинов, которая позволяет легко добавлять дополнительные функции. Например. Вы можете выбрать один из множества плагинов для доступа к различным источникам данных для загрузки данных в Gatsby.
Слой данных Gatsby работает на GraphQL. Используя язык запросов GraphQL, вы можете легко извлекать данные на страницы и компоненты. Этот общий подход к обработке данных является уникальной особенностью Gatsby по сравнению с другими генераторами статических сайтов.
Нет лучшего времени, чтобы начать с Gatsby !
Gatsby является относительно новым и уже получил большую поддержку со стороны сообщества. Доступны многие расширения, и Gatsby используется все большим количеством производственных веб-сайтов.
Gatsby отлично подходит для обеспечения выдающегося пользовательского опыта в браузере, а также является строительным блоком при реализации стека JAM (JavaScript, API, Markup).
Используя Gatsby, вы можете применять существующие навыки веб-разработки (современный JavaScript, React, Node.js и GraphQL). Кривая обучения чрезвычайно крутая, и вы быстро сможете получить впечатляющие результаты.
Gatsby объединяет многие из самых популярных тенденций веб-разработки прямо сейчас: React, GraphQL, создание статических сайтов, JAM-стек, подход Headless CMS... добавьте Gatsby.js в свой набор навыков прямо сейчас и оставайтесь на переднем крае технологий!
Подход Headless CMS
Основной особенностью Gatsby является загрузка данных из множества различных источников данных с использованием одного общего подхода (GraphQL) для переноса данных на страницы и компоненты. Эта функция позволяет вам управлять вашим контентом в любой CMS или серверной части. Часто этот подход называется «Headless CMS», и Gatsby является идеальным инструментом для применения этого подхода на практике и присоединения внешнего уровня к любой CMS.
В разделах курса вы узнаете:
- Используйте Gatsby для создания сверхбыстрых статических сайтов с помощью React и GraphQL
- Работа со страницами, компонентами и активами
- Применение стилей в Gatsby с использованием глобальных стилей, модулей CSS или styled components
- Встроенный слой данных Gatsby и GraphQL
- Получение данных с использованием статических запросов и запросов страниц
- Используйте систему плагинов Gatsby
- Используйте исходные плагины для подключения к источникам данных
- Используйте плагины для преобразования данных в правильный формат
- Программно создавать страницы
- Работа с изображениями в Gatsby
- Создание сайта Gatsby для производства и развертывания
- и многое другое...
Посмотреть больше
-
Урок 1. 00:10:20Course Introduction
-
Урок 2. 00:03:46Setting Up The Development Environment
-
Урок 3. 00:13:40Setting Up Gatsby & Creating Your First Gatsby Project
-
Урок 4. 00:16:59Exploring The Project Structure
-
Урок 5. 00:12:22Working With Pages
-
Урок 6. 00:11:21Woking With Components
-
Урок 7. 00:04:53Linking Between Pages
-
Урок 8. 00:07:33Working With Assets
-
Урок 9. 00:18:17Using Layout Components
-
Урок 10. 00:08:44Global Styles
-
Урок 11. 00:15:04Using Typography.js
-
Урок 12. 00:13:54Using CSS Modules
-
Урок 13. 00:13:22Using Styled Components
-
Урок 14. 00:15:32GraphQL In Gatsby & Using GraphiQL
-
Урок 15. 00:07:31Adding A Page Query
-
Урок 16. 00:08:28Using A StaticQuery
-
Урок 17. 00:11:29Using A Source Plugin
-
Урок 18. 00:09:49Displaying Source Plugin Data On Pages
-
Урок 19. 00:13:21Using A Transformer Plugin
-
Урок 20. 00:15:17Displaying Transformer Plugin Data On Pages
-
Урок 21. 00:15:41Creating Slugs With Node
-
Урок 22. 00:14:51Creating Pages With Node
-
Урок 23. 00:11:12Creating Pages From Markdown Files
-
Урок 24. 00:05:42Linking To Pages
-
Урок 25. 00:08:34Installing Image Plugins
-
Урок 26. 00:06:46Querying Images
-
Урок 27. 00:09:39Displaying Images in Pages
-
Урок 28. 00:10:23Add Offline Support
-
Урок 29. 00:05:45Add A Manifest File To Your Gatsby Site
-
Урок 30. 00:09:06Adding Page Metadata With React Helmet
-
Урок 31. 00:04:46Building A Static Site For Production
-
Урок 32. 00:14:51Deploying To Netlify
-
Урок 33. 00:18:05Starting A New Gatsby Project And Setup Contentful
-
Урок 34. 00:20:57Connecting Gatsby To Contentful
-
Урок 35. 00:12:27Programmatically Create Post Pages From Contentful
-
Урок 36. 00:13:22Implement The Blog Post Template
-
Урок 37. 00:09:01Outputting A List Of Posts
-
Урок 38. 00:10:37Displaying Images From Contentful
Автор - udemy
Категории
Комментарии
Команда внимательно читает ваши комментарии и оперативно на них реагирует. Вы можете спокойно оставлять запросы на обновления или задавать любые вопросы о курсе здесь.
Другие материалы в этой категории
leveluptutorials
7 мар. 2018 г., 17:09
Pro Gatsby
В этой серии мы погружаемся в Gatsby.js, создавая блог с markdown, Netlify CMS и Contentful и охватываем все: от анимации страниц до нескольких вариантов хостинга, которые автоматически восстанавливаются. Наслаждайтесь мощью новейших веб-технологий - React.js, Webpack, современного JavaScript и CSS... все настроено и ожидает вас.Богатая система плагинов Gatsby позволяет создавать сайты с нужными вам данными - из одного или нескольких источников:
leveluptutorials
3 нояб. 2018 г., 09:16
Pro Gatsby 2
В этой серии уроков мы погрузимся глубже в Gatsby версии 2. Эта версия курса полностью переработана и пересоздана с моего курса Pro Gatsby, и содержит тонну нового контента, который покрывает не только основы Gatsby.
leveluptutorials
2 мая 2018 г., 15:06
Headless WordPress
Узнайте, как можно легко создать сайт WordPress с помощью как Next.js, так и Gatsby. В этой серии мы рассматриваем подводные камни и методы, используемые для создания невероятно быстрых сайтов WordPress с помощью React.
Gatsby Мастер-класс
The Gatsby Masterclass
Создавайте невероятно быстрые, многофункциональные и в целом потрясающие приложения React с платформой Gatsby. Хотите сделать самые быстрые, самые производительные и в целом лучшие приложения React? Смотрите не дальше, чем Gatsby. Этот курс - лучшее руководство, которое вы найдете для изучения фреймворка Gatsby. В нем мы создадим полный блог и онлайн-магазин, от начала проекта до развертывания в Интернете.
frontendmasters
1 мая 2019 г., 19:11
Введение в Gatsby
Introduction to Gatsby
На этом семинаре вы узнаете, как создавать быстрые приложения и веб-сайты с помощью React, используя Gatsby, генератор статических PWA (Progressive Web App). Более 50% людей покинут мобильный сайт, если его загрузка займет более 3 секунд. Если вы не готовы отказаться от половины своих потенциальных клиентов, производительность в современной сети больше не является просто галочкой. К счастью, существует множество инструментов, которые помогут вам