JavaScript? REST API ???

REST API(Representational State Transfer Application ????? ?????)? ???? ??????? ???? ? ?? ?????. ? ??? ????? ? ? ?? ? ??? ?? ???? JavaScript?? REST API? ???? ??? ???? ? ??? ? ????.

---

1. REST API? ??????

REST API? ???? ?????(?: ???? ?? ??? ?)? ??? ???? ???? ????? ??? ? ????. ?? HTTP ??? ???? ??? ????? ????.

?? ??

1. ???: ?????? ?????(?: ??? ???? ?? /users).
2. HTTP ??:
   • GET: ???? ?????.
   • POST: ? ???? ?????.
   • PUT: ?? ???? ???????.
   • ??: ???? ?????.
3. ??? ??: JSON? ????? ??? ??? ?????.
4. HTTP ?? ??:
   • 200 OK: ??.
   • 201 ???: ???? ???????.
   • 400 ??? ??: ?????? ?????.
   • 404 ?? ? ??: ???? ?? ? ????.
   • 500 ?? ?? ??: ?? ?????.

---

2. ?? ? ??

• ??????:

  • ????(fetch ?? axios ?????? ?? JavaScript).
  • https://jsonplaceholder.typicode.com? ?? API? ??? ??? ???.

• ???:

  • Node.js? ???? Express ?????? ?????.

---

3. ????? ??? REST API ??

JavaScript? REST API? ?????? ?? fetch() API? axios? ?? ?? ?????? ?????.

---

fetch()? ???? ??? ????

REST API?? ???? ???? ??? ??? ????.

// Fetch data from an API
const fetchUsers = async () => {
  try {
    const response = await fetch('https://jsonplaceholder.typicode.com/users');
    if (!response.ok) {
      throw new Error(`HTTP error! Status: ${response.status}`);
    }
    const users = await response.json(); // Parse JSON data
    console.log(users);
  } catch (error) {
    console.error('Error fetching users:', error);
  }
};

fetchUsers();

??:

1. fetch(url): HTTP ??? ???.
2. response.json(): ??? JSON ???? ?????.
3. ?? ??? ???? ??? ??? ??? ???? ?? try...catch? ???? ?????.

---

POST? ??? ??

? ???? ????? fetch() API? ?? POST ???? ?????.

const createUser = async () => {
  try {
    const response = await fetch('https://jsonplaceholder.typicode.com/users', {
      method: 'POST', // HTTP method
      headers: {
        'Content-Type': 'application/json', // Specify JSON format
      },
      body: JSON.stringify({ // Convert JavaScript object to JSON
        name: 'Jane Doe',
        email: 'jane.doe@example.com',
      }),
    });

    const newUser = await response.json(); // Parse JSON response
    console.log(newUser);
  } catch (error) {
    console.error('Error creating user:', error);
  }
};

createUser();

?? ???:

• method ??? HTTP ???? ?????.
• ?? ??? ??? ??? ???? ? ?????.
• ???? JSON ????? ???? ????.

---

4. ?? ??? REST API ??

?????? ????? Express ?????? ??? Node.js? ???? REST API? ?????.

?? ??

1. Node.js ??: Node.js? ???????.
2. ? ???? ???:

// Fetch data from an API
const fetchUsers = async () => {
  try {
    const response = await fetch('https://jsonplaceholder.typicode.com/users');
    if (!response.ok) {
      throw new Error(`HTTP error! Status: ${response.status}`);
    }
    const users = await response.json(); // Parse JSON data
    console.log(users);
  } catch (error) {
    console.error('Error fetching users:', error);
  }
};

fetchUsers();

---

??? REST API ???

??? ?? REST API ??? ????.

const createUser = async () => {
  try {
    const response = await fetch('https://jsonplaceholder.typicode.com/users', {
      method: 'POST', // HTTP method
      headers: {
        'Content-Type': 'application/json', // Specify JSON format
      },
      body: JSON.stringify({ // Convert JavaScript object to JSON
        name: 'Jane Doe',
        email: 'jane.doe@example.com',
      }),
    });

    const newUser = await response.json(); // Parse JSON response
    console.log(newUser);
  } catch (error) {
    console.error('Error creating user:', error);
  }
};

createUser();

??:

• ????: app.use(express.json())? ???? JSON ??? ?? ?????.
• ??:
  • GET /users: ?? ???? ?????.
  • GET /users/:id: ?? ???? ?????.
  • POST /users: ? ???? ?????.
  • PUT /users/:id: ??? ????? ???????.
  • DELETE /users/:id: ???? ?????.

---

5. REST API ???

Postman? ?? ??? ?? ?? ??? ????? ???? API? ???? ? ????.

?? ??? ??

1. ???? Postman? ?????.
2. ? ?? ???:
   • GET http://localhost:3000/users: ?? ???? ?????.
   • POST http://localhost:3000/users: JSON ???? ???? ?????.

? ??

   mkdir rest-api-demo
   cd rest-api-demo
   npm init -y
   npm install express

---

6. REST API ?? ?? ??

1. ?? ?? ????? ??? ?????(?: /data ?? /users).
2. ???? ??? ??? ???? ???? ?? ??? ??? ?????.
3. ???? HTTP ?? ??? ????.
4. Swagger ?? Postman? ?? ??? ???? API? ??????.

---

? ?? ?? ???

??

REST API? ?? ? ??? ?????. ????? ?? ?? ? ???? JavaScript? REST API? ?? ???? ??? ??? ?????? ?? ? ??? ?? ??? ?? ??? ?? ? ????. ??? ?????. ?? API? ???? ??? ?? Node.js ? Express? ???? ???? API? ?????.

---

? ???? ?? ??? ?? ????? ??? ?????!

? ??? JavaScript? REST API ??? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!