Download "GraphQL #4 Новый тип и связь между типами (Different Type & Type Relations)"

Please wait. We're preparing links for easy ad-free video watching and downloading.

Previous video: CSS Grid #4 Именование grid-линий, создание сетки, позиционирование элементов Next video: 💻 JavaScript для начинающих: Введение

💻 JavaScript для начинающих: Введение

💻 JavaScript для начинающих: Введение

Channel: METATECH

CSS Grid #4 Именование grid-линий, создание сетки, позиционирование элементов

CSS Grid #4 Именование grid-линий, создание сетки, позиционирование элементов

Channel: webDev

⚡️ BACK-END это тоже интересно! Разработка интернет магазина с НУЛЯ | День 6 [React/Nest.js]

⚡️ BACK-END это тоже интересно! Разработка интернет магазина с НУЛЯ | День 6 [React/Nest.js]

Channel: RED Group

Как эффективно изучать программирование 👨‍💻 4 совета

Как эффективно изучать программирование 👨‍💻 4 совета

Channel: Maksim Zhashkevych

$64 - React JS - практика, button disabled (follow\unfollow)$

64 - React JS - практика, button disabled (follow\unfollow)

Channel: IT-KAMASUTRA

web

develop

front-end

frontend

веб

разработка

программирование

обучение

education

tutorial

лекция

образование

graphql tutorial

learn graphql

apollo client

mlab

react

reactjs

react js

graphql tutorial for beginners

graphql apollo

graphql react

graphql уроки

graphql введение

graphql для начинающих

graphql запросы

graphql как работает

graphql обзор

graphql руководство

graphql туториал

graphql overview

apollo graphql

react graphql apollo tutorial

react graphql

yauhenk

webdev

graphql

00:00:00

[music]

00:00:13

I welcome you, my name is Evgeniy

00:00:15

Kovalchuk and you are on the pbs channel

00:00:18

dedicated to web development and everything

00:00:20

connected with it, we continue to look at the

00:00:22

graph library with you in previous

00:00:25

topics, we discussed with you the

00:00:27

creation of a scheme, the creation of a root

00:00:30

query and a sub-query, as well as using the

00:00:33

graphics interface, you tested the

00:00:36

query we created, well, it’s

00:00:39

time to move on and consolidate the

00:00:42

knowledge gained in this video lesson, we will

00:00:44

create another one for the query and

00:00:47

establish a connection between two

00:00:50

data sets, or, to put it more correctly,

00:00:53

between two collections, so let’s go

00:00:56

as you can see on line 12, I created

00:01:00

another data array

00:01:01

which I called directors or directors,

00:01:05

then I will call this array

00:01:07

of collections, in fact, these are the directors

00:01:10

who made films from the first collection,

00:01:13

movies, each director field contains the

00:01:17

name and age, and so on, to begin with,

00:01:21

using the email column, pressed Let's

00:01:22

describe the data type of our new

00:01:26

collection, it looks like this: it's

00:01:51

ready, as you can see, everything was done

00:01:54

almost according to the templates of the previous

00:01:57

example. Additionally,

00:01:59

we imported the Kinel int graph to

00:02:02

determine the age type, since this is a

00:02:05

number, I immediately draw your attention to the fact

00:02:08

that this is an integer number, that is, without a

00:02:11

comma

00:02:12

for comma numbers, it is quite possible

00:02:14

to use the data type

00:02:16

graph kevin wang, the rest is done

00:02:19

according to the template perfectly, now it’s time for taxes and

00:02:23

we also need to add a

00:02:26

separate query for the collection

00:02:29

of directors to our root query, it looks like this,

00:02:48

everything is similar to the previous one under

00:02:50

queries as tight we we specify

00:02:53

director

00:02:54

type since this is a new type of collections.

00:02:58

We also send IDs as arguments,

00:03:00

which is logical since directors

00:03:04

will also be the easiest to request in theory, and

00:03:06

in the call method

00:03:08

we go through the collection and return

00:03:11

the director to which the

00:03:14

passed ID corresponds. Let's check the

00:03:16

request we wrote in the graph. weight

00:03:19

if we go to dogs and open the query,

00:03:22

then as you can see our director request has

00:03:26

also appeared and let’s

00:03:29

throw some director as an example,

00:03:39

launch the request perfectly, we got a

00:03:43

director with a passed request for food,

00:03:46

in fact, we repeated the basic template for

00:03:49

creating a request

00:03:50

and now we move on as it was

00:03:53

said, all the films in the movies collections were

00:03:57

crumpled and directors in the

00:04:00

directors collection and our task is now to

00:04:03

establish this relationship, let's

00:04:05

try to make sure that when requesting a

00:04:08

movie, we additionally return

00:04:10

data about the director who shot this

00:04:13

film, first we need to add this

00:04:16

connection data since in At the moment,

00:04:19

2 of our collection is absolutely unrelated to anything

00:04:21

and we don’t even know who

00:04:24

made which film. To determine this,

00:04:26

let’s add a director ID field to each film in our movies collection

00:04:32

corresponding to the director ID.

00:04:50

Great, we have indicated the connection between the film and the

00:04:53

director, well, since we added a

00:04:56

new one field to a collection element, we

00:04:59

need to update the schema of this element,

00:05:01

however, we will describe this

00:05:04

not as an ordinary field with data, but as a

00:05:07

connection between collections,

00:05:17

so we specified the type times director

00:05:20

and as you can see, this is not some type

00:05:23

from the column, but the type director type we created

00:05:26

however, this is not enough; we

00:05:29

additionally need to add the Velev method;

00:05:38

we have already used this method and, as

00:05:41

you remember, based on the received

00:05:44

arguments, it returns certain

00:05:46

data from the collection, and for this we

00:05:49

used the arcs argument,

00:05:51

that is, we took the ID received in the arguments

00:05:54

and used it to look for the desired

00:05:57

element, however now this is where we don’t pass it

00:06:00

into arguments, so where can we get the required

00:06:03

identifier for the director, as it’s logical

00:06:06

to guess, now we’ll take it from

00:06:09

the torrent and the logic of this method

00:06:11

will look like this,

00:06:21

but that’s all, nothing complicated, we take an

00:06:24

array of directors and go through its

00:06:27

elements searching for the required

00:06:29

IT which we receive from the

00:06:31

parent request, in this way we

00:06:34

establish a connection between the two

00:06:37

collections and now let's

00:06:39

switch to the schedule and try to

00:06:41

request the film as well as data on the

00:06:44

director who shot it,

00:06:59

as you could see after refreshing the

00:07:02

page in the fields I now have the

00:07:04

director field I want to display the

00:07:07

name of the director and his age, we run

00:07:11

the request and everything works out perfectly.

00:07:13

We received the data and agree, it’s

00:07:16

really cool, and not only is it

00:07:19

cool, it’s also quite simple and

00:07:21

intuitive, since in the request we

00:07:24

simply describe the object and its structure,

00:07:28

if you have any left then

00:07:30

write them in the comments and don’t forget

00:07:33

to subscribe to the channel and like the

00:07:36

video, see you next lecture bye

00:07:40

[music]

Description:

Всех приветствую в курсе «GraphQL». В данном видео-курсе мы с вами разберём библиотек GraphQL. GraphQL – фактически это язык запросов или синтаксис, который описывает как запрашивать данные, созданный в компании Facebook в 2012 году. Его разработали в качестве альтернативы REST-архитектуры. Он позволяет клиенту запросить лишь желаемые данные. За все отвечает именно клиент. Т.е. GraphQL можно использовать не только на серверной, но и на клиентской стороне. Он имеет три основные характеристики: - Он позволяет клиенту точно указать, какие данные ему нужны. - Облегчает агрегацию данных из нескольких источников. - Использует систему типов для описания данных. ✒ Репозиторий курса: ✔ GitHub: https://github.com/YauhenKavalchuk/graphql ✒ Используемые ресурсы и инструменты: ✔ Atom (Редактор кода):https://github.blog/2022-06-08-sunsetting-atom/ ✔ Create React App (Рабочее окружение): https://github.com/facebook/create-react-app ✔ mLab (База данных): https://mlab.com ✔ Material-UI (Интерфейс приложения): https://mui.com/material-ui/ ✔ Apollo Client: https://www.apollographql.com/docs/react/ ✒ Полезные ссылки: ✔ Graphql (Документация):https://graphql.org/learn/ ✒ Полезные курсы на канале: ✔ ES6: https://www.youtube.com/playlist?list=PLNkWIWHIRwMGLJXugVvdK7i8UagGQNaXD ✔ React & Redux: https://www.youtube.com/playlist?list=PLNkWIWHIRwME_Gv2vlWAR6TfeSXylYfw4 ✒ Полный список готовых и планируемых курсов: ✔ Trello: https://trello.com/b/R6rD7qq8 ✒ Автор курса: ✔ YouTube: https://www.youtube.com/YauhenKavalchuk ✔ Instagram: https://www.facebook.com/unsupportedbrowser ✔ Twitter: https://twitter.com/YauhenKavalchuk ✔ VK: https://vk.com/YauhenKavalchuk ✔ LinkedIn: https://www.linkedin.com/in/YauhenKavalchuk ✔ GitHub: https://github.com/YauhenKavalchuk ✔ VK (Группа): http://vk.com/webdevcom ✒ Поддержать развитие канала: https://github.com/YauhenKavalchuk/youtube/blob/main/sponsoring.md

Preparing download options

Popular

HD video

Only sound

All

* — If the video is playing in a new tab, go to it, then right-click on the video and select "Save video as..."

** — Link intended for online playback in specialized players

Questions about downloading video

How can I download "GraphQL #4 Новый тип и связь между типами (Different Type & Type Relations)" video?

http://unidownloader.com/ website is the best way to download a video or a separate audio track if you want to do without installing programs and extensions.
The UDL Helper extension is a convenient button that is seamlessly integrated into YouTube, Instagram and OK.ru sites for fast content download.
UDL Client program (for Windows) is the most powerful solution that supports more than 900 websites, social networks and video hosting sites, as well as any video quality that is available in the source.
UDL Lite is a really convenient way to access a website from your mobile device. With its help, you can easily download videos directly to your smartphone.

Which format of "GraphQL #4 Новый тип и связь между типами (Different Type & Type Relations)" video should I choose?

The best quality formats are FullHD (1080p), 2K (1440p), 4K (2160p) and 8K (4320p). The higher the resolution of your screen, the higher the video quality should be. However, there are other factors to consider: download speed, amount of free space, and device performance during playback.

Why does my computer freeze when loading a "GraphQL #4 Новый тип и связь между типами (Different Type & Type Relations)" video?

The browser/computer should not freeze completely! If this happens, please report it with a link to the video. Sometimes videos cannot be downloaded directly in a suitable format, so we have added the ability to convert the file to the desired format. In some cases, this process may actively use computer resources.

How can I download "GraphQL #4 Новый тип и связь между типами (Different Type & Type Relations)" video to my phone?

You can download a video to your smartphone using the website or the PWA application UDL Lite. It is also possible to send a download link via QR code using the UDL Helper extension.

How can I download an audio track (music) to MP3 "GraphQL #4 Новый тип и связь между типами (Different Type & Type Relations)"?

The most convenient way is to use the UDL Client program, which supports converting video to MP3 format. In some cases, MP3 can also be downloaded through the UDL Helper extension.

How can I save a frame from a video "GraphQL #4 Новый тип и связь между типами (Different Type & Type Relations)"?

This feature is available in the UDL Helper extension. Make sure that "Show the video snapshot button" is checked in the settings. A camera icon should appear in the lower right corner of the player to the left of the "Settings" icon. When you click on it, the current frame from the video will be saved to your computer in JPEG format.

What's the price of all this stuff?

It costs nothing. Our services are absolutely free for all users. There are no PRO subscriptions, no restrictions on the number or maximum length of downloaded videos.