env var local

Author: ndungtse

.gitignore

@@ -36,3 +36,5 @@ yarn-error.log*
 
 # typescript
 *.tsbuildinfo
+
+.vercel

components/Home/HomeComp.tsx

@@ -60,9 +60,6 @@ const HomeComp: React.FC <Props> = ({gameData, loading}) => {
   )
 }
 
-// const getServerSideProps: GetServerSideProps = async()=>{
-//   const res = await axios.get('')
-// }
 
 export default HomeComp
 

contexts/allGames.tsx

@@ -23,23 +23,6 @@ type Props = {
 export function GameProvider({children}: Props, { gameData }: any){
     console.log(gameData);
 
-    const getGames = async()=>{
-        const options = {
-            method: 'GET',
-            url: 'https://free-to-play-games-database.p.rapidapi.com/api/games',
-            headers: {
-              'X-RapidAPI-Host': 'free-to-play-games-database.p.rapidapi.com',
-              'X-RapidAPI-Key': 'bbce629d3cmsh48cb41094daa35cp1157cejsn05466969482c'
-            }
-          };
-        const res = await Axios.request(options)
-        console.log(res);
-        return {
-          props: {
-            gameData: res.data
-          },
-        };
-      };
 
     return(
         <GameContext.Provider value={gameData}>

contexts/gameContext.tsx

@@ -76,13 +76,13 @@ const Game: NextPage = () => {
 
   const getGame = async()=>{
     if (game!==undefined) {
-    const res = await Axios.get(`https://api.rawg.io/api/games/${game}?key=a5c36a8abe0c4ddb9489dc567b3cf68d`)
+    const res = await Axios.get(`https://api.rawg.io/api/games/${game}?key=${process.env.API_KEY}`)
     setGameDet(res.data)
   }
   }
   const getGameTrailers = async()=>{
     if (gameDetails!==undefined) {
-    const res = await Axios.get(`https://api.rawg.io/api/games/${game}/movies?key=a5c36a8abe0c4ddb9489dc567b3cf68d`)    
+    const res = await Axios.get(`https://api.rawg.io/api/games/${game}/movies?key=${process.env.API_KEY}`)    
     setGameTrailers(res.data.results)
   }
   }
@@ -104,7 +104,7 @@ const Game: NextPage = () => {
       params: {q: gameDetails.name+app},
       headers: {
         'X-RapidAPI-Host': 'bing-image-search1.p.rapidapi.com',
-        'X-RapidAPI-Key': 'bbce629d3cmsh48cb41094daa35cp1157cejsn05466969482c'
+        'X-RapidAPI-Key': `${process.env.RAPID_IM_KEY}`
       }
     };
     const res = await axios.request(options)

pages/game/[game].tsx

@@ -41,7 +41,7 @@ const Home: NextPage<Props> = ({gameData,isLoading, setIsLoading}: any) => {
 
 export const getStaticProps: GetStaticProps = async()=>{
 
-  const res = await Axios.get('https://api.rawg.io/api/games?key=a5c36a8abe0c4ddb9489dc567b3cf68d')
+  const res = await Axios.get(`https://api.rawg.io/api/games?key=${process.env.API_KEY}`)
   return {
     props: {
       gameData: res.data

pages/index.tsx

@@ -44,7 +44,7 @@ const Page = ({ gameData }: any) => {
   const getNextPageGames = async () => {
       setLoading(true)
     const res = await Axios.get(
-      `https://api.rawg.io/api/games?key=a5c36a8abe0c4ddb9489dc567b3cf68d&page=${page}`
+      `https://api.rawg.io/api/games?key=${process.env.API_KEY}&page=${page}`
     )
     console.log(res)
     setLoading(false)
@@ -94,14 +94,4 @@ const Page = ({ gameData }: any) => {
   )
 }
 
-// export const getStaticProps: GetStaticProps = async()=>{
-
-//     const res = await Axios.get('https://api.rawg.io/api/games?key=a5c36a8abe0c4ddb9489dc567b3cf68d')
-//     return {
-//       props: {
-//         gameData: res.data
-//       },
-//     };
-//   };
-
 export default Page

pages/store/[page].tsx

@@ -37,7 +37,7 @@ const Store: NextPage = ({gameData}: any) => {
 
 export const getServerSideProps: GetServerSideProps = async()=>{
 
-  const res = await Axios.get('https://api.rawg.io/api/games?key=a5c36a8abe0c4ddb9489dc567b3cf68d')
+  const res = await Axios.get(`https://api.rawg.io/api/games?key=${process.env.API_KEY}`)
   return {
     props: {
       gameData: res.data

pages/store/index.tsx

@@ -24,7 +24,7 @@ const Search = () => {
 
     const getSearchedItem = async()=>{
       setLoading(true)
-      const res = await Axios.get(`https://api.rawg.io/api/games?key=a5c36a8abe0c4ddb9489dc567b3cf68d&search=${search}`)
+      const res = await Axios.get(`https://api.rawg.io/api/games?key=${process.env.API_KEY}&search=${search}`)
       setSearchRes(res.data.results)
       setLoading(false)
     }