UFO Sightings

Getting Started

Follow these steps to run the UFO Sightings app locally:

1. Install Dependencies

After cloning the repo, run npm install to install all the necessary dependencies.

2. Set Up Environment Variables

• Create a .env file in the root directory.
• Use .env.example as a reference.
• Add the following variable: VITE_UFO_SIGHTINGS_API_ENDPOINT=<your-api-endpoint>.

3. Run the Development Server

Run npm run dev and the app will be available at http://localhost:5173.

QA Notes

Please go through the following checks:

1. Loading State

• Go to the network tab in Google Dev Tools and enable throttling (e.g. "3G").
• Refresh the page.
• Check that a loading spinner appears while the data is being fetched.

2. Network Error Handling

• In the .env file, temporarily introduce a mistake in the VITE_UFO_SIGHTINGS_API_ENDPOINT (e.g. change part of the URL).
• Refresh the page.
• Check that an alert box appears in the UI, notifying the user of the failed request.
• Go to the console tab in Google Dev Tools to check more info about the error.

3. Responsive Design

• Click the Toggle Device Toolbar icon in Google Dev Tools.
• Test the layout at various screen sizes (e.g. mobile, tablet, desktop).
• Check that the UI adapts properly to different screen sizes and remains usable.