[PR34] Fix call Apis functions

[sosososoyoen]

PURPOSE call Meal APIs and get a categories list using react-query

quangthan's feedback

1. in Next.js, a reserved folder name called "api" can be used inside the folder "pages" to create backend, so please consider changing "api.js" to something else
2. move BASE_PATH const in "api.js" to file "constants.js" for consistency
3. use custom hooks and react-query hydration method in Next.js reference https://codesandbox.io/s/v39-geckos-team-07-hvx5gc?file=/src/pages/index.js https://react-query.tanstack.com/guides/ssr#using-hydration

works I fix call Apis functions like quangthan's codebox.

1. delete api.js and make a hook folder, "useCategories.js"
2. refactoring function getCategories -before-

   export async function getCategories() {
   const res = await fetch(`${MEALDB_BASE_PATH}/list.php?c=list`);
   const data = await res.json();
   return data;
   }

   -after-

   const data = await (
   await fetch(`${MEALDB_BASE_PATH}/list.php?c=list`)
   ).json();

3. move const BASE_PATH in "constants.js"
4. use react-query hydration method