https://github.com/aaronpowell/nextjs-graphql-trivia-demo

https://github.com/aaronpowell/nextjs-graphql-trivia-demo

Last synced: about 1 month ago
JSON representation

• Host: GitHub
• URL: https://github.com/aaronpowell/nextjs-graphql-trivia-demo
• Owner: aaronpowell
• License: mit
• Created: 2022-04-28T04:14:31.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2023-01-04T16:25:42.000Z (almost 2 years ago)
• Last Synced: 2024-04-13T22:23:48.718Z (9 months ago)
• Language: Shell
• Size: 271 KB
• Stars: 2
• Watchers: 5
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: License.md

Awesome Lists containing this project

README

        
## Next.js trivia app

This is a Next.js trivia demo application that shows how you can use GraphQL in an API route to talk to [Azure Cosmos DB](https://docs.microsoft.com/azure/cosmos-db/?WT.mc_id=javascript-72896-aapowell) to make an application that can be deployed to [Azure Static Web Apps](https://docs.microsoft.com/azure/static-web-apps?WT.mc_id=javascript-72896-aapowell) using the [hybrid Next.js app support]().

## Getting Started

### Devcontainer

The simplest way to get started is using a [VSCode devcontainer](), which has been shipped as part of this repository. When VSCode opens it will prompt you to open in the container and that will install the relevant Node.js packages, as well as setting up the [cross-platform Cosmos DB emulator](https://docs.microsoft.com/azure/cosmos-db/linux-emulator?tabs=ssl-netstd21&WT.mc_id=javascript-72896-aapowell) (to learn more on how that is all setup, check out [this blog post](https://www.aaron-powell.com/posts/2021-05-27-local-dev-with-cosmosdb-and-devcontainers/)).

You'll need to create the `.env.local` file using the `.env.sample` template (which contains the local emulator configuration settings).

### Manual setup

To get started you'll need the following installed:

- Node.js 14 (you can use `nvm use` against the .nvmrc in the repo)

- [Cosmos DB emulator](https://docs.microsoft.com/azure/cosmos-db/local-emulator?tabs=ssl-netstd21&WT.mc_id=javascript-72896-aapowell) (or you can use Cosmos on Azure)

Clone the repo from GitHub and run `npm install`

### Importing data

A sample dataset, obtained from [OpenTrivia DB](https://opentdb.com/), exists in the `trivia.json` file. You can import this via `npm run import-data`, [using the VSCode extension for Azure Databases](https://github.com/microsoft/vscode-cosmosdb/blob/main/README.md#import-into-cosmos-db) or import using the [data migration tool](https://docs.microsoft.com/en-us/azure/cosmos-db/import-data?WT.mc_id=javascript-72896-aapowell).

## Deployment

This application can be found at [https://nextjs-trivia-demo.aaron-powell.com](https://nextjs-trivia-demo.aaron-powell.com) and is deployed using the [hybrid rendering support on Azure Static Web Apps]().