Որտե՞ղ է լավագույնը կատարել բեկենդի հարցումները։

Լավագույն միջոցը backend-ին հարցումներ կատարել կոդում ասինխրոն մեթոդների միջոցով:

1. Հաճախորդի կողմում (բրաուզերումում):

   • Օգտագործելով API fetch կամ գրադարան, ինչպիսիք են Axios:
   • Համապատասխան է օգտագործողի ինտերակտիվ գործողությունների, տվյալների դինամիկ բեռնում, ձևերի ուղարկման համար:
   • Հնարավոր է ստեղծել SPA (Single Page Applications):
   • Կիրառվում է JavaScript/TypeScript-ում:

   // Օրինակ fetch-ով
   async function fetchData() {
     try {
       const response = await fetch('/api/data');
       if (!response.ok) {
         throw new Error(`HTTP սխալ! վիճակ: ${response.status}`);
       }
       const data = await response.json();
       console.log(data);
     } catch (error) {
       console.error('Տվյալների ստացման սխալ:', error);
     }
   }
   

2. Սերվերի կողմում (օրինակ, SSR/SSG ֆրեյմվորկների օգտագործմամբ):

   • Ֆրեյմվորկներում, ինչպիսիք են Next.js կամ Nuxt.js (React և Vue համապատասխանաբար):
   • Տվյալները կարող են ստացվել կառուցման ժամանակ (SSG) կամ յուրաքանչյուր հարցում (SSR):
   • SEO և կատարողականությունը բարելավվում է (քիչ է "սպիտակ էկրան"), քանի որ էջը ռենդեր է տվյալներով:
   • Օգնում է խուսափել CORS խնդիրներից:
   • Օրինակներ Next.js-ում՝ getStaticProps, getServerSideProps:

   // Next.js օրինակ (getServerSideProps)
   export async function getServerSideProps(context) {
     const res = await fetch('https://api.example.com/data');
     const data = await res.json();
   
     if (!data) {
       return {
         notFound: true, // Ցույց տալ 404 էջ
       };
     }
   
     return {
       props: { data }, // Տվյալները փոխանցել որպես props էջի կոմպոնենտին
     };
   }
   

Ընտրությունը կախված է անհրաժեշտ ինտերակտիվության մակարդակից, SEO-ի կարիքներից, ծրագրի տեսակից (SPA, MPA) և օգտագործվող ֆրեյմվորկից: Հաճախ օգտագործվում է այս մոտեցումների կոմբինացիան: