3일차 - 알고리즘(조건문if), React (HTTP,API)

Geun A·2021년 9월 1일

👊🏻 codecamp 수업 3일차...
3일짼데 진도가 너무 빨라 복습하기도 전에 또 진도가 나가니까 머릿속이 복잡해지고 있다🤯
그렇다고 놓치기 시작하면 끝이 없는 법!!!
수업시작엔 흐름만 익히고 퀴즈풀면서 복습하기로😤

수업내용 정리 시작

📌 알고리즘 2일차 - 조건문if

조건문 (if)

조건이 일치하면 true
조건이 일치하지 않으면 false
else문법에 if를 추가로 적용할 수 있다
이때 반드시 소괄호()에 조건식을 넣어야 한다

📌 React 3일차 - HTTP, API

📌HTTP 통신

HTTP: 두 컴퓨터간에 텍스트 데이터를 주고 받는 길
HTTP라는 길로 requst와 response로 서로 주고 받을 수 있음
requst(요청)
텍스트 데이터를 back-end컴퓨터로 보내고 back-end컴퓨터가 데이터를 데이터베이스에 저장해달라고 요청
response(응답)
요청을 받은 back-end컴퓨터가 성공, 실패 등 처리 결과를 응답
응답 상태코드
성공(200), front-end에러(400), back-end에러(500)

📌API

HTTP요청을 back-end컴퓨터에 보냈을때 실행되는 back-end컴퓨터 기능
API에 요청할때 보내는 데이터 API함수로 들어갈 인자,
응답으로 받게되는 데이터 API함수의 return 데이터

종류
rest-API: 모든 데이터를 받아야만 함 - axios
graphql-API: 필요한 데이터를 골라 받을 수 있음 - apollo-client
front-end에 설치하는 라이브러리 -> axios,apollo-client

방식 apllo-client
생성API -> CREATE -> MUTATION
수정API -> UPDATE -> MUTATION
삭제API -> DELETE -> MUTATION
조회API -> READ -> QUERY

📌API명세서

API명세서 = API설명서
API명세서는 back-end 개발자에서 받아야 함
API 요청 결과 타입(JSON)
JSON(자바스크립트 객체 표기)

Git branch
Git log
Git pull origin master

Yarn dev -p 3001 로하면
Port 3001로 켜짐

Port 3000 -<서버 프로그램 똑같은 포트는 하나밖에 실행 못함

✍ 입력

function onChangePassword(event){
      setPassword(event.target.value)
      //내용을 치면 기존에 생겼던 이벤트(Error)가 사라지게 하는 이벤트
      if(event.target.value !== ""){
        setPasswordError("")
      }
    }

📌 { 코드캠프 } n주차 Quiz

✍ 입력

코드를 입력하세요

2021.09.01 수업내용 정리 & 퀴즈 마무리

axios 방식만 배웠던 나로써는 apllo-client 헷갈린다
axios는 내가 원하는대로 만들어서 썼는데
apllo-client로는 만들어져있는대로 써야된다니...
그럼 axios가 더 자유롭게 쓸 수 있으니 편한게 아닌가..?싶지만
apllo-client를 써보다보면 이해되겠지

profile
Frontend 개발입문자 코린이의 코딩이야기

0개의 댓글