매주 사내 개발자들을 대상으로 하는 세미나에서 GraphQL을 발표한 내용입니다. 기본적인 개념과 어떤 것을 공부 하면 익힐 수 있는지 가벼운 코드와 라이브러리를 소개합니다.

1. !1

2. !2

3. !3

4. !4

5. !5

6. !6

7. !7

8. !8

9. !9

10. !10
GraphQL is a data query language developed by Facebook as an
alternate to REST and ad-hoc webservice architectures.
REST ad-hoc webservice architectures
( GraphQL )

11. !11

12. !12

13. !13

14. !14

15. !15

16. !16

17. !17

18. !18

19. !19

20. !20

21. !21
📱
👔 📦 $
📱
👔 📦 $

22. !22

23. !23

24. !24

25. !25

26. !26

27. !27

28. !28
// GET /graphQL
query {
account(id: "1"){
username
email
firstName
lastName
}
}
{
"data": {
"account": {
"username": "samslow",
"email": "hsseo@lfin.kr",
"firstName": "Hyeonseok",
"lastName": "Seo"
}
}
}

29. !29
// GET /graphQL
query {
account(id: "1"){
username
email
firstName
lastName
friends{
firstName
userName
}
}
}
{
"data": {
"account": {
"username": "samslow",
"email": "hsseo@lfin.kr",
"firstName": "Hyeonseok",
"lastName": "Seo"
"friends": [
{
"username": "gamjaman"
},
{
"username": "kongsun"
}
]
}
}
}

30. !30
// GET /graphQL
mutaion {
createAccount(
userName: "samslow"
email: "hsseo@lfin.kr"
firstName: "Hyeonseok"
lastName: "Seo"
)
}{
username
email
}
{
"data": {
"createAccount": {
"username": "samslow",
"email": "samslow@gmail.com",
"firstName": "Hyeonseok",
"lastName": "Seo",
"friends": []
}
}
}

32.
type Character {
name: String!
appearsIn: [Episode]!
}type Query {
hero(episode: Episode): Character
droid(id: ID!): Droid
}

33. !33

34. !34

35. !35
•
•
•

36. !36

37. !37
..
, GraphQL .
REST URL Resource ,
GraphQL URL .
Query Mutaion( ) .
url Query GraphQL .

38. !38
• GraphQL →
→
API →
•
• →
• .

39. !39

40. !40

41. !41
• 가장 현대적인 웹을 만들자 3편 (GraphQL))
• GraphQL 공식 홈페이지
• GraphQL을 오해하다
• when-and-why-to-use-graphql
• GraphQL이 무엇인가

42. !42