TIL0708

toLowerCase 는 소문자로 바꿔준다
##toHigherCase는 대문자
ex) string.toLowerCase()

문자열도 배열이다. 무슨말일까?
배열이라고 하면
[“a”, “b”, “c”] 이게 배열이라 생각했는데
“abc” 에서의 배열??

그러면
[“a”, “b”, “c”] === “abc” ???

const aaa = “hello”
aaa[2]

var browserType = 'mozilla';
browserType.length;

browserType[0];

browserType[browserType.length-1];

리엑트
비동기/동기 통신개념

//서버와 데이터를 주고 받는 방식

//비동기 통신
async function 함수이름() {
서버 컴퓨터에 요청하는 코드}
//동기 통신
async function 함수이름() {
await 서버 컴퓨터에 요청하는 코드}

async function 함수이름(){
axios(“api이름”)
]
async function 함수이름(){
await axios(“api이름”)
]

근데 await라는 단어하나로 동기 비동기를 구분가능한가?
즉 자바스크립트는 동기랑 비동기 둘다 가능 한 것인가?
다른 언어들도 다 동기랑 비동기 둘다 구현이 가능한가?
동기랑 비동기 개념은 프론트와 백엔드 사이의 통신에서만 있는 것인가?

통신을 한다는 것은
프론트에서 백엔드와의 통신인가? 요청과 응답에 의한 통신
아니면, 프론트와 데이터베이스 상의 통신인가? 백엔드는 중간 매개체로 통신을 하는 것인가?

axios는 기본적으로 비동기 속성

await 받을때 까지 기다렸다가 정보를 보여줌
status: 200 정상적인 성공
status: 500 실패 등등

http 상세코드들 과 친해지자..

rest api 의 단점이 데이터들을 한번에 가져와한다는 것이였는데
예로 xxx.data.tiltle
이렇게 쓰면 필요한 데이터만 가져오는거라 생각이 든다.
graphql의 장점이 데이터에서 필요한 객체만 가져올 수 있다는 것인데
뭐가 다른건지 잘 모르겠다.

뒤에 이미 rest api는 요청하는 부분의 데이터를 다 긁어 모아 왔고 거기서
분류하여 보여준다.
const aaa = x
배열을 불러오는법 aaa.data[]
배열의 객체를 불러오는법 aaa.data[].title

통체로 다 보여주지를 못한다.
왜그럴까? aaa.data[1]은 안될까?
객체 그대로 보여줄수 없다 안에 있는 문자와 숫자만 뽑아서 찍어줄 수 있다.
배열 그대로 보여줄수 없다 이것도 마찬가지다.

app.js는 셋팅하는부분 여기다 apollo셋팅이 필요하다
class에서 yarn dev를 치고
중간에 /를 치고 들어갈때 class안에있는 _app.js를 거쳐서 파일들에 적용된다.
아폴로 설정법
uri란? 백엔드가 있는 주소
url에서 ?뒷부분을 빠지고 앞에 있는 부분은 uri

리엑트에서 페이지가 하나의 큰 컴포넌트이다.

항상 어떤 부분을 넘어갈때 _app.js를 거쳐서 지나간다.
apollo 리엑트에서 설정법 (_app.js)

onChange 의미 다시 확인하기

import 로 리엑트에서 가져올때
useState는 {}로 가져오는데
apollo는 그냥 가져온다 뭐가 차이가 있을까?
export defalut로 내보내냐 —> {}없이 불러올 수 있다.
export 로 내보내냐의 차이

export defalut는 한페이지에 한개씩 아니면 아예 없던가 해야한다.

vsc에서 elements Consol, soles, network 를 가장 많이 사용한자.

http://backend02.codebootcamp.co.kr/graphql

graphql 등록이 안됬을때

try {
  const result = await createBoard({
    variables: {
      writer: writer,
      password: password,
      title: title,
      contents: contents,
    },
  });
  alert(result.data.createBoard.message);
} catch (error) {
  alert(error.message);
}