Последние новости: Свежий coursehunters.club

Full-Stack React с GraphQL и Apollo Boost - Видеоуроки

Full-Stack React with GraphQL and Apollo Boost
Duration 06:52:36
Открыть все курсы от udemy

Full-Stack React with GraphQL and Apollo Boost - Полный список уроков

Развернуть / Свернуть
  • Урок 1. Project App Demo 00:10:53
  • Урок 2. GraphQL Introduction 00:08:10
  • Урок 3. Apollo / Apollo Boost Introduction 00:03:05
  • Урок 4. Install Packages our for Project 00:01:59
  • Урок 5. Git Clone and npm Install Dependencies 00:01:08
  • Урок 6. Initialize Express Server 00:02:38
  • Урок 7. Create MLab Database and Connect To It 00:03:54
  • Урок 8. Create Mongoose Schemas 00:06:07
  • Урок 9. Add Apollo-Express Middleware 00:04:23
  • Урок 10. Create GraphQL Schema 00:04:34
  • Урок 11. Add bodyParser Middleware and Root Query Type 00:03:48
  • Урок 12. Create First Mutation 00:05:28
  • Урок 13. Create First Query 00:03:24
  • Урок 14. Create React Application with create-react-app 00:01:41
  • Урок 15. Clean Up App.js and Add Components Folder 00:02:46
  • Урок 16. Add Client Dependencies and Set Up ApolloClient/ApolloProvider 00:02:02
  • Урок 17. Create Queries Folder, Write First Apollo Query 00:05:06
  • Урок 18. Add cors Middleware to Prevent Cross-Origin Errors 00:02:06
  • Урок 19. Add Skeleton CSS and Base Styles 00:01:20
  • Урок 20. Create Signup Mutation 00:06:19
  • Урок 21. Hash User Password with bcrypt 00:03:34
  • Урок 22. Add Routing with react-router-dom 00:05:18
  • Урок 23. Add Form to Signup Component 00:03:07
  • Урок 24. Manage Input State in Signup Form 00:05:37
  • Урок 25. Add Mutation Component to Signup Component, Write SIGNUP_USER Apollo Mutation 00:05:43
  • Урок 26. Add onSubmit to Signup Form, Run Signup Mutation on Client 00:03:59
  • Урок 27. Create Error Component, Clear State Upon Submit, Add Form Validation 00:09:12
  • Урок 28. Create Signin Mutation on Backend 00:05:36
  • Урок 29. Implement Signin Mutation on Client 00:03:38
  • Урок 30. Add Token to Local Storage, Put Token on Authorization Header 00:06:27
  • Урок 31. Verify JWT on Backend to Get Current User 00:03:20
  • Урок 32. Add getCurrentUser Query, Create withSession Component 00:10:32
  • Урок 33. Redirect Upon Signin/Signup, Refetch getCurrentUser Query Upon Redirect 00:05:34
  • Урок 34. Add Navbar Component, Add Search Component 00:06:22
  • Урок 35. Add Navbar Links For Auth User 00:04:52
  • Урок 36. Make Navbar Dynamic, Add Custom Heading 00:03:33
  • Урок 37. Implement Signout Button 00:06:08
  • Урок 38. Map Over Recipes, Create Recipe Item Component 00:05:35
  • Урок 39. Create Recipe Page, Get Recipe Id From Path 00:06:08
  • Урок 40. Add getRecipe Query in Backend, Run Query on Recipe Page 00:06:07
  • Урок 41. Output getRecipe Data to Recipe Page, Scaffold Add Recipe Form 00:06:26
  • Урок 42. Make AddRecipe a Stateful Component 00:05:46
  • Урок 43. Implement addRecipe Mutation on Client 00:11:46
  • Урок 44. Clear State and Redirect Upon addRecipe Mutation 00:03:29
  • Урок 45. Learning and Implementing Optimistic UI 00:10:27
  • Урок 46. Create searchRecipes Query on Backend, add Apollo Query to Search Component 00:07:59
  • Урок 47. Index Recipe Fields, Perform Search Query on Input Change Event 00:08:59
  • Урок 48. Add SearchItem Component 00:02:51
  • Урок 49. Add UserInfo Component to Profile Page 00:09:48
  • Урок 50. Add UserRecipes Component to Profile Page, Implement getUserRecipes Query 00:07:47
  • Урок 51. Add Route Protection with withAuth Component 00:09:00
  • Урок 52. Add and Implement deleteUserRecipe Mutation 00:06:53
  • Урок 53. Add Optimistic UI to deleteUserRecipe Mutation 00:05:13
  • Урок 54. Add refetchQueries to deleteUserRecipe Mutation 00:02:04
  • Урок 55. Add refetchQueries to addRecipe Mutation 00:02:08
  • Урок 56. Provide Default Text for User Without Recipes 00:01:27
  • Урок 57. Create LikeRecipe Component and Hide If Not Auth 00:04:06
  • Урок 58. Add and Implement likeRecipe Mutation 00:08:07
  • Урок 59. Develop Client-side Logic to Properly Toggle Like 00:05:40
  • Урок 60. Create and Implement unlikeRecipe Mutation with Optimistic UI 00:09:43
  • Урок 61. Prepare for Deployment 00:04:13
  • Урок 62. Use Fragments to Clean Up Queries 00:05:04
  • Урок 63. Deploy to Heroku 00:12:49
  • Урок 64. Add Additional CSS to Project 00:01:50
  • Урок 65. Adds imageUrl field on Recipe model and imageUrl input in addRecipe 00:04:45
  • Урок 66. Display Recipe Image on Home Page, Build Card 00:04:37
  • Урок 67. Style Recipe Page 00:05:31
  • Урок 68. Add CKEditor Component to AddRecipe Page for Formatted Instructions 00:05:54
  • Урок 69. Intro to React Pose Animation Library 00:07:26
  • Урок 70. Add React Pose Animation to Home Page 00:07:18
  • Урок 71. Add Spinners When Loading 00:05:03
  • Урок 72. Style Searchbar and Redeploy 00:04:17
  • Урок 73. Add Update Button, Make UserRecipes Stateful Component 00:02:53
  • Урок 74. reate Edit Recipe Modal 00:06:46
  • Урок 75. Populate Edit Recipe Modal 00:04:53
  • Урок 76. Create updateUserRecipe Mutation, Execute on Client 00:08:25

Создавайте и развертывайте приложение с React и GraphQL с нуля с помощью Apollo Boost, Express и MongoDB.

Этот курс предназначен для всех, кто хочет начать создавать приложения с помощью React и GraphQL! В этом курсе мы создадим приложение "рецептов" с нуля с полной аутентификацией (signup, signin, signout), а также с возможностью создавать, просматривать, искать, сохранять и удалять рецепты.

Построение этого проекта даст вам навыки для создания приложений полного стека React и GraphQL с нуля для любой темы, которая вам нравится!

Этот курс предполагает некоторый опыт работы с React, но если вы знакомы с базовыми концепциями JavaScript и имеете некоторые знания о функциях ES6, вы сможете проходить курс.

  • Мы начнем с создания бэкэнда с помощью Node.js с использованием Express, а затем узнаем, как интегрировать наш сервер с GraphQL. Мы узнаем о важнейших вопросах в GraphQL, таких как запросы, мутации, схемы и решения, мы изучим синтаксис GraphQL и много поработаем с GraphiQL для тестирования наших запросов и мутаций, после чего мы перейдем к работе с React.
  • Затем мы создадим приложение React, подключим его к нашему серверу GraphQL-Express с помощью Apollo Boost. Мы рассмотрим все новейшие функции Apollo Boost и React Apollo, включая ApolloClient, ApolloProvider / ApolloConsumer, а также компоненты Query и Mutation. Кроме того, мы узнаем, как обновлять запросы, использовать Optimistic UI, компоненты запросов и мутаций, использовать фрагменты и многое другое!
  • Помимо изучения всех возможностей Apollo Boost, мы будем использовать основные библиотеки React, такие как React Router (версия 4), чтобы обеспечить маршрутизацию для нашего приложения, узнать, как создавать защищенные маршруты, использовать основные методы жизненного цикла, укрепить надлежащие методы управления состоянием, использовать полезные фичи ES6, такие как операторы распространения объектов и массивов, деструктурирование объектов и массивов, а также более чистые методы React, такие как синтаксис инициализатора свойств.
  • Когда мы закончим создание нашего приложения, мы пройдем процесс развертывания в Heroku. Мы создадим сценарий postbuild, который позволит нам развернуть наше приложение с полным стеком, используя CLI Heroku.
  • В качестве раздела бонуса мы собираемся погрузиться в некоторые дополнительные библиотеки компонентов React, что даст нам возможность предоставить пользователям способность настраивать свои рецепты и сделать наше приложение отзывчивым с помощью CSS.

Твоя оценка

11 0
Следи за последними обновлениями и новостями в нашем coursehunters.club, или вступай в наш канал telegram.

Комментарии

Похожие курсы

15-04-2018 en 76 уроков
udemy MERN Stack Front To Back: Full Stack React, Redux & Node.js
Создавайте и разверните социальную сеть с помощью Node.js, Express, React, Redux и MongoDB и узнайте как собрать все это вместе.Добро пожаловать в «MERN Stack Front To Back». В этом курсе мы создадим полномасштабное приложение социальной сети, используя Node.js, Express, React, Redux и MongoDB вместе с ES6 +. Мы начнем с пустого текстового редактора и закончим развертывание полного приложения.
Duration 16:27:20
47 1
en
fullstack.io Fullstack React Book - The Complete Guide to ReactJS and Friends
Обновленное, подробное руководство по React. Станьте экспертом ReactJS уже сегодня. Прекратите тратить свое время на запутаные и неполные уроки и книги. Есть так много неправильных, запутанных и устаревших статей и книг... В одном учебнике говорится одно, в другом нечто совершенно иное. Слишком много вариантов. Существует пятьдесят различных паттернов и дюжина различных реализаций Flux. Какой из них лучше? Гугл только доводит вас до страха ......
Duration
41 1
24-08-2017 en 192 урока
udemy Node with React: Fullstack Web Development
Создавайте и развертывайте веб-приложения с помощью NodeJS, React, Redux, Express и MongoDB. Примечание. Этот курс предполагает что у вас уже есть знания React и Redux. Посмотрите мой курс «Modern React with Redux», он будет отличной подготовкой для вас перед просмотром этого курса.
Duration 25:43:06
17 0
16-01-2018 en 252 урока
udemy The complete React Fullstack course
Вы хотите увидеть весь процесс создания своего приложения? Тогда этот курс для вас. Поднимите свой скилл на новый уровень с помощью React, Node js, MongoDB, Firebase, Webpack и ES6.

Мы начнем с самого начала, начиная с «Я даже не знаю, как использовать это ... и зачем мне оно», чтобы реально понять, как работает React, и заставить его общаться с другими технологиями, такими как Firebase и Node js. Вы узнаете всю логику и...
Duration 44:33:39
47 0
17-01-2018 en 119 уроков
udemy JavaScript and React for Beginners: Create 12 projects
Практический подход к работе с JavaScript и React шаг за шагом. JavaScript является самым популярным языком сценариев в мире. Он отвечает за интерактивность, например, игры, онлайн-формы или опросы, с которыми пользователь может взаимодействовать на веб-сайте. Самые динамичные сайты, если не все сайты, содержат какой-то элемент JavaScript.
Duration 11:45:40
4 9
en 23 урока
leveluptutorials Level 1 Apollo Client with React
В этой серии мы погружаемся в работу с API GraphQL с React и Apollo. Узнайте все о том, как работает Apollo Client, передовой опыт и управление локальным состоянием. Создайте универсальный API GraphQL поверх существующих API REST, чтобы вы могли быстро отправлять новые функции приложений, не ожидая изменений в бэкэнд.
Duration 04:24:35
5 0
16-09-2018 en 68 уроков
wesbos Full Stack Advanced React + GraphQL
Премиум курс от Wes Bos - Full Stack Advanced React + GraphQL на рельаном примере научит строить вас проекты высокого уровня с помощью React.  Подобно тому, как React изменил способ создания веб-приложений, GraphQL меняет способ сборки API для запроса и изменения данных. С упором на современное приложение для JavaScript и реального мира, этот курс является начальным способом изучения Full Stack Advanced React, GraphQL, Node.js и друзей.
Duration 16:19:09
34 0
09-10-2018 ru 78 уроков
udemy React + Redux - Профессиональная Разработка
Практическая разработка коммерческих React приложений. Чтобы сделать этот курс максимально полезным, мне очень важно знать мнение первых учеников. А это невозможно сделать, не поделившись готовыми уроками уже сейчас. Этот курс снят на 70% (это означает, что несколько последних глав ещё не добавлены в курс).
Duration 09:56:04
48 1
04-09-2018 en 66 уроков
udemy Build a Slack Chat App with React, Redux, and Firebase
Создайте полное приложение чата с полным стеком с начала и до конца с помощью React, Redux, Firebase 5 и Semantic UI React. Заинтересованы в создании впечатляющих приложений с полным стеком с помощью React, Redux и Firebase? Это курс для вас!
Duration 05:54:48
0 0

Последнее добавленное

Gulp Сборка. Ускорение верстки

Gulp Сборка. Ускорение верстки

ru
Как вам идея зарабатывать больше, ускорив свой рабочий процесс, за счет внедрения новых инструментов? Все еще используете HTML + CSS? Переходи на красную сторону силы! У нас есть Gulp - Автообновление в браузере, LESS/SASS разложен по модулям, Нет дублированию кода, Компонентый подход.
Веб-разработка Full-Stack | Node, SQL, React и многое другое

Веб-разработка Full-Stack | Node, SQL, React и многое другое

en
Создайте проект fullstack с помощью Node.js, PostgreSQL, SQL, React, Redux! API, аутентификация и многое другое! Это тот курс, который вам нужен, прежде чем стать инженером. Это тот курс, который был мне нужен, прежде чем я стал инженером-программистом, работающим в центре города в Сан-Франциско.
Изучение Blockchain разработки с EOS и C++

Изучение Blockchain разработки с EOS и C++

en
Изучите экосистему ЕOS dApp и узнайте, как писать и развертывать смарт-контракты в EOSIO блокчейн. Смарт-контракты? Они здесь. EOS Blockchain? Да. C ++? Тут! Не может быть никаких сомнений: технология EOS и blockchain является самой разрушительной силой за последние годы. Компании не могут...
Знакомство с API ВКонтакте от Тарасова Алексея

Знакомство с API ВКонтакте от Тарасова Алексея

ru
Курс о том, как отправлять запросы к программному интерфейсу сервиса ВКонтакте и получать или размещать информацию в соц. API – это программный интерфейс взаимодействия между главным приложением (ВКонтакте) и дополнительными внешними приложениями. С помощью HTTP запросов к специальному серверу...
Асинхронные методы и примеры в Python

Асинхронные методы и примеры в Python

en
Поддержка асинхронного и параллельного программирования Python сильно недооценена. В этом курсе вы узнаете весь спектр параллельных API-интерфейсов Python. Мы начнем с изучения новых и мощных асинхронных и ожидающих ключевых слов вместе с базовым модулем: asyncio. Затем мы перейдем к потокам...
chat
logo