docs: improve gitpod docs (#206)

* worked on the gitpod documentation

* Update gitpod.mdx

* rename image from Gitpod_env to GitpodEnv

---------

Co-authored-by: Rotimi Best <best@classroomio.com>

apps/docs/pages/contributor-guides/gitpod.mdx

@@ -1,3 +1,7 @@
+import Image from 'next/image';
+import { Callout } from 'nextra/components';
+import GitpodEnv from './images/gitpod_env.png';
+
 # Gitpod Setup
 
 ## One Click Setup
@@ -7,3 +11,18 @@
 - Click the button below to open this project in Gitpod.
 
 [![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/rotimi-best/classroomio)
+
+<Callout type="info">
+  Gitpod does not utilize `localhost` for accessing services. Instead, it uses its own URL after
+  starting all the necessary services. The correct URLs to access the project are automatically
+  inserted into the `.env` file upon initialization.
+</Callout>
+
+### Viewing URLs in Terminals
+
+To view the URLs, follow these steps:
+
+1. Open your terminal.
+2. Click on the `port` to see the URLs.
+
+<Image src={GitpodEnv} alt="gitpod" quality="100" />