분류 전체보기 (49) 썸네일형 리스트형 GraphQL + Prisma (3) Prisma 존재성 파트 # prisma-client-lib 문법 분석 가이드 입니다. # prisma 쿼리 존재성 파트 yarn prisma-client-lib 이후 프리즈마 데모 서버에서 데이터를 쿼리하는 방법을 정리 했습니다. # 단순히 공부한 내용을 열거합니다. --------------------------------------------------------------------------------------------------------------------------- [prisma.$exists] : 데이터가 존재하는 아닌지 bool 반환 ------------------------------------------------------------------------------------------------.. GraphQL + Prisma (2) Prisma 쿼리파트 # prisma-client-lib 문법 분석 가이드 입니다. # prisma 쿼리 파트 yarn prisma-client-lib 이후 프리즈마 데모 서버에서 데이터를 쿼리하는 방법을 정리 했습니다. # 단순히 공부한 내용을 열거합니다. --------------------------------------------------------------------------------------------------------------------------- #1. [prisma.users] User라는 타입이 있다고 생각해 봅시다. --------------------------------------------------------------------------------------------------.. GraphQL + Prisma (1) 프리즈마 데이터 모델 분석 # 1. 프리즈마 데이터 모델을 작성해 봅시다. - 새로운 타입 정의 하기. User라고 정의하면 type User{이안에 데이터 필드를 채우면 됩니다.} # 2 . 1개의 데이터 타입은 prisma가 자동으로 쿼리랑 뮤테이션을 만들어 줍니다. 한마디로, 나는 User객체만 만들었는데, 자동으로 CURD 관련 기능을 만들어 줍니다.! - 쿼리 users, user, usersConnection - 뮤테이션 createUser, updateUser , deleteUser, upsertUser, - 뮤테이션 updateManyUsers, deleteManyUsers ## 2. 데이터 요소 정의하기 ## 2.0 id 정의하기 type User { id: ID! @id ... } ## 2.1 String으로 필.. Graphql Prisma 연습 (2) - User Mutation 정보 추가하기 # 백단 # 타입을 정의합니다. type Query { Users: [User!] } type Mutation { createUser(name: String!, password: String!, picture: String): User! } # 단순히 정보가 들어오면 -> prisma.createUser를 합니다. import { prisma } from "../../../generated/prisma-client"; export default { Query: { Users: async () => { const data = await prisma.users(); return data; } }, Mutation: { createUser: async (_, { name, password, picture }).. Graphql Prisma 연습 (1) - 단순 Query Users 모든 정보 가져오기 # 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 "gr.. Graphql Prisma 연습 (0) - 환경셋팅 #1. 백 셋팅 #1.1 # gprahql-yoga grpahql-tools merge-graphql-schemas@1.7.3 prisma prisma-client-lib #는 필수로 설치해야한다. # 그외 모듈은 추가적인 셋팅 # babel은 ES 최신문법을 사용하기 위해 # dotenv는 설정 파일 한곳으로 모으기, morgan은 서버 로깅 툴 # nodemailler 와 sendgrid는 이메일 전송을 위해 #passport는 로그인 인증을 위함. # DOStody ## 환경 설정 - Grapqh + Prisma 를 기본 프로젝트 셋팅으로 가져가자. ```js yarn add graphql-yoga graphql-tools merge-graphql-schemas@1.7.3 yarn add @babe.. Git - 깃허브 CLI / branch/merge 초간단 사용법 --------------브런치까지 쉽게 grpahl로 보려면, git log --all --graph --oneline --------------브런치 따기 git branch git branch ms | apple | google // 현재 작업물(master)이랑 똑같은 레포를 3개더 만들었다. git checkout apple // 애플 작업소로 가서 커밋하고 로그를 보면 부모 자식관의 브런치 관계가 보임. --------------브런치 합치기 (master) git merge o2 // 현재 master 브런치인데, o2브런치와 병합을 하려한다. 충돌시 수정할것들 보이고 다시 커밋 //참고) git commit --amend // 커밋 메시지 수정하기. git reset --hard [버전] .. React - CSS FrameWork ㅡ MUI 사용하기 시작! React - CSS FrameWork ㅡ MUI 사용하기 #0. MUi 는 처음 써보는데 문서정리가 잘되있어서 빠르게 배울수 있다는 느낌을 받았다. 그래서 조금씩 알아가기로 함. #1. 예제 1 import React, { useState } from "react"; import styled, { ThemeProvider } from "styled-components"; import NoSsr from "@material-ui/core/NoSsr"; import { Button, Container, Typography } from "@material-ui/core/"; import { makeStyles, createMuiTheme } from "@material-ui/core/styles"; impo.. 이전 1 2 3 4 5 ··· 7 다음
