Quindar Skills Test

In this project you will retrieve and display launch data from SpaceX's public GraphQL API.

The objective of this challenge is to create a custom component to best display historical and upcoming launch data. Feel free to use any libraries or components that you are comfortable with.

• You should use the Apollo GraphQL client to retrieve any launch data that you find interesting and display the historical and upcoming launch data in an intuitive format.

• We have included an antd Table to display some initial data.

• The styling is messed up with the current Table and you can update the styling as you choose for your custom component. We don't expect production-quality design here.

• A strech goal would be to create an interactive component that displays more details of a single launch when the user interacts with your component.

• This challenge is intended to take roughly one hour. The component is not expected to be production-ready, we just want to see your approach to this problem.

• If you are uncertain about specifics, try to push forward and state your assumptions in code comments, but if there are any blocking questions then you can reach out to Zach (zach.meza@quindar.space) or Sunny (sunny@quindar.space).

To ensure privacy, please follow these steps to share your code with us:

• Create a new repository under your gh username, ensuring the visibility is set to private.
• Clone the skills-test repository.
• Create a new remote using the upstream repository's URL.
• Set the origin URL to that of your newly-created private repository.
• Push to origin .
• Invite us to your private repository:
  • sunbrst
  • zachmeza
  • smparekh
  • annshultequindar

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/pages/page.tsx. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Learn More

This is a Next.js project bootstrapped with create-next-app.

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation - learn about Next.js features and API.
• Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!