I am new to web development and am following this tutorial:its pretty old and hence uses older version of next js. He uses getServerSideProps which is depreciated, and throws an error when I use it in app router.

export async function getServerSideProps(context: GetServerSidePropsContext) {
  try {
    const communityDocRef = doc(firestore,"communities",context.query.communityId as string);
    const communityDoc = await getDoc(communityDocRef);

    return {
      props: {
        communityData: communityDoc.exists()
          ? JSON.parse(
              safeJsonStringify({ id: communityDoc.id, ...communityDoc.data() })
            )
          : "",
      },
    };
  } catch (error) {
    console.log("getServerSideProps error", error);
  }
}

My understanding is that I can now call async await on any function and doesn’t have to be getServerSideProps which I did, but in the tutorial he uses the context.query parameter of getServerSideProps for the query string which I need, how would I implement it without getServerSideProps.

export async function getData()
{
    const communityDocRef = doc(firestore, "communities", context.query.communityId as string)
    const communityDoc = await getDoc(communityDocRef);
    return communityData: communityDoc.data()
}

How would I get the query here?, as of now it doesn’t recognize context.