# 1. 백단 -
# 타입 쿼리 : Users라는 요청문은 User라는 타임을 리스트로 반환한다.
type Query {
Users: [User!]
}
# prisma 문법으로 Users를 다 가져오고 리턴 / 반드시 비동기 처리할것
# 만약 return문으로 prisma. 이라면 자동으로 promise가 풀린다음 반환하므로 await가 필요없음
import { prisma } from "../../../generated/prisma-client";
export default {
Query: {
Users: async () => {
const data = await prisma.users();
return data;
}
}
};
# 1. 프론트단
# - gql문법 작성
import gql from "graphql-tag";
const USERS = gql`
{
Users {
id
name
password
picture
}
}
`;
# - 쿼리훅 작성
const { loading, error, data } = useQuery(USERS);
# - 쿼리훅 변수에 따른 컴포넌트 랜더링
<>
{loading && "loading..."}
{!loading && error && "ERROR : 404"}
{!loading && data && data.Users && <HomePresenter Users={data.Users} />}
</>
DOS IMPACT - WEB Developer
KIM DO YOUNG
WEB : REACT JS | REACT NATIVE | GraphQL PRISMA
'GraphQL BackEnd > Practice' 카테고리의 다른 글
Graphql Prisma 연습 (2) - User Mutation 정보 추가하기 (0) | 2020.02.05 |
---|---|
Graphql Prisma 연습 (0) - 환경셋팅 (0) | 2020.02.05 |