ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 실습 - Request보내기
    카테고리 없음 2022. 12. 26. 23:25

    # 학습용 URL : https://learn.codeit.kr/api/members
    (1) 전체 직원 정보 조회 - GET 
    (2) 특정 직원 정보 조회 - GET 
    (3) 새 직원 정보 추가 - POST
    (4) 기존 직원 정보 수정 - PUT
    (5) 기존 직원 정보 삭제 - DELETE


    =============================

    (2) 특정 직원 정보 조회 - GET
    (4) 기존 직원 정보 수정 - PUT
    (5) 기존 직원 정보 삭제 - DELETE

    이 작업들을 수행할 때는 작업의 대상이 되는 직원 정보를 특정할 수 있도록 URL 끝에 아래와 같은 고유 식별자를 붙여줘야 합니다. (직원의 id 값입니다.)

    https://learn.codeit.kr/api/members/3
    지금 이 URL은 3번 직원 정보에 대한 작업을 수행하겠다는 뜻입니다. 이렇게 작업의 종류에 따라 메소드뿐만 아니라 URL도 적절하게 변경해가며 써줘야 합니다.

    =======================================


    (1) 전체 직원 정보 조회 - GET 
    (3) 새 직원 정보 추가 - POST

    들은 특정 직원 정보를 대상으로 수행하는 작업이 아니라 아니라 전체 직원 정보에 대해서 수행하는 작업이기 때문에

    https://learn.codeit.kr/api/members
    /members로 끝나는 원래의 URL을 그대로 사용

    =============

    1) GET 

    fetch('https://learn.codeit.kr/api/members')
    .then((response) => response.text())
    .then((result) => {console.log(result)});
    [
      {
        "id": 1,
        "name": "Jason",
        "email": "jason@codeitmall.kr",
        "department": "engineering"
      },
      {
        "id": 2,
        "name": "Alice",
        "email": "alice@codeitmall.kr",
        "department": "engineering"
      },
      {
        "id": 3,
        "name": "Brian",
        "email": "brian@codeitmall.kr",
        "department": "marketing"
      },
      {
        "id": 4,
        "name": "Erica",
        "email": "erica@codeitmall.kr",
        "department": "marketing"
      },
      {
        "id": 5,
        "name": "Wilson",
        "email": "wilson@codeitmall.kr",
        "department": "sales"
      }
    ]

    새로운멤머추가하기

    // fetch('https://learn.codeit.kr/api/members')
    // .then((response) => response.text())
    // .then((result) => {console.log(result)});
    
    
    새로운 직원 추가하기 
    
    새로운 직원의 정보를 request의 body에 넣어주기 
    
    
    fetch('https://learn.codeit.kr/api/members'
    
       body: JSON.stringify(newMember)
       // stringify는 JS객체를 string type의 json으로 바꿔준다 
       // 어떤 JS객체가 담고 있는 정보를 외부에 노출시키기위해선 string 타입의 json 바꿔줘여헌더 ,JS객체는 못 전달하줌
    
    
    
    )
    
    
    
    const newMember = {
        name: "yuna", 
        email: "yunajoe@gmail.com", 
        department: "tech",
    }
    
    
    fetch('https://learn.codeit.kr/api/members', {
        method: 'POST', 
        body: JSON.stringify(newMember), 
    })
        .then((response) => response.text())
        .then((result)=> { console.log(result); }); 
        
    
    Promise {<pending>}
    VM1127:13 {
      "id": 6,
      "name": "yuna",
      "email": "yunajoe@gmail.com",
      "department": "tech"
    }
    
    
    // 
     id가 추가되어서 왔다. 
    응답이 어떻게 올지는 서버마다 다르다.(
    개발자가 어떻게 구현하는냐에 따르다

     

    댓글

Designed by Tistory.