Vue 3 and GraphQL - GitHub Search

This GitHub search client was scaffolded via Vue CLI. Simply type a query into the search bar to retrieve a list of relevant repositories.

Using Vue 3's Composition API and the Vue Apollo (v4) library, a component's data requirements are defined alongside its lifecycle hook registrations and other functionality, all within a single setup method. With access to GitHub's GraphQL API, components can easily integrate with GitHub using flexible queries.

Visit the master branch of this repository for the final version of this application.

Project Setup

Install the dependencies.

$ npm install

Create a .env file in the root of the project directory. Add the VUE_APP_GITHUB_ACCESS_TOKEN environment variable to this file, and set it to a GitHub access token.

(.env)

VUE_APP_GITHUB_ACCESS_TOKEN=XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Running in Development Environment

Run the application for local development:

$ npm run serve

Navigate to localhost:8080. You should see your application running. The application hot-reloads on all file changes (state changes are preserved).

Compilation and Minification for Production

Generate a build optimized for production:

$ npm run build

Linting Files

Lint files to statically analyze code for potential errors:

$ npm run lint

Customize Configuration