मध्ये बाह्य API एकत्र करणे Next.js: RESTful APIs किंवा GraphQL

Next.js या विभागात, आम्ही तुम्हाला RESTful API किंवा सेवांमधून डेटा आणून तुमच्या अनुप्रयोगामध्ये बाह्य डेटा एकत्रित करण्याच्या प्रक्रियेत मार्गदर्शन करू GraphQL. बाह्य API समाकलित करून, तुम्ही तुमचा अनुप्रयोग रिअल-टाइम डेटासह समृद्ध करू शकता आणि डायनॅमिक वापरकर्ता अनुभव प्रदान करू शकता.

RESTful API वरून डेटा आणत आहे

RESTful API बाह्य स्रोतांकडून डेटा पुनर्प्राप्त करण्याचा एक सामान्य मार्ग आहे. तुम्ही तुमच्या अर्जातील RESTful API मधून डेटा कसा मिळवू शकता ते येथे आहे Next.js:

बाह्य API ला HTTP विनंत्या करण्यासाठी fetch API किंवा लायब्ररी वापरा. axios

प्रतिसाद हाताळा आणि API मधून पुनर्प्राप्त केलेल्या डेटावर प्रक्रिया करा.

import axios from 'axios';  
  
function fetchData() {  
  axios.get('https://api.example.com/data')  
    .then(response => {  
      const data = response.data;  
      // Process the data  
    })  
    .catch(error => {  
      console.error(error);  
    });  
}  

GraphQL सेवेमधून डेटा आणत आहे

GraphQL API साठी एक क्वेरी भाषा आहे जी तुम्हाला आवश्यक असलेल्या डेटाची विनंती करण्यास सक्षम करते. GraphQL तुमच्या अर्जातील सेवेमधून डेटा आणण्यासाठी Next.js:

सेवेला क्वेरी पाठवण्यासाठी GraphQL क्लायंट लायब्ररी वापरा. apollo-client GraphQL

GraphQL आपण पुनर्प्राप्त करू इच्छित डेटा निर्दिष्ट करण्यासाठी क्वेरी परिभाषित करा .

import { ApolloClient, InMemoryCache, gql } from '@apollo/client';  
  
const client = new ApolloClient({  
  uri: 'https://graphql.example.com',  
  cache: new InMemoryCache(),  
});  
  
function fetchGraphQLData() {  
  client.query({  
    query: gql`  
      query {  
        posts {  
          title  
          content  
        }  
      }  
    `,  
  })  
    .then(result => {  
      const data = result.data;  
      // Process the data  
    })  
    .catch(error => {  
      console.error(error);  
    });  
}  

निष्कर्ष

बाह्य API समाकलित करणे, RESTful किंवा GraphQL, तुम्हाला विविध स्त्रोतांकडून डेटा ऍक्सेस करण्याची आणि Next.js अद्ययावत आणि डायनॅमिक सामग्रीसह तुमचा अनुप्रयोग वर्धित करण्याची अनुमती देते. API एकत्रीकरणामध्ये प्रभुत्व मिळवून, तुम्ही तुमच्या अनुप्रयोगामध्ये अधिक समृद्ध आणि अधिक आकर्षक वापरकर्ता अनुभव प्रदान करू शकता.