PLC/vPLC>> react-typescript-graphql-github-api-demo>> 返回
项目作者： nerdyman

项目描述 ：
GitHub API V4 demo with React, TypeScript and urql
高级语言： TypeScript
项目地址: git://github.com/nerdyman/react-typescript-graphql-github-api-demo.git


React TypeScript GraphQL Github API Demo

CircleCI

React + TypeScript app demo using the GitHub V4 GraphQL API.

Features

  • Configurable (.env)
  • Offline caching (offline-plugin)
  • Continuous integration (CircleCI)
  • Continuous deployment (netlify)
  • Optimized
    • Embedded critical CSS

Set up

You will need to generate a personal access token to connect to the GitHub GraphQL API.

To do this navigate to https://github.com/settings/tokens/new and select the following options:

  • repo
    • repo:status
    • repo_deployment
    • public_repo
    • repo:invite
      admin:org
    • read:org
      admin:public_key
    • read:public_key
  • notifications
  • user
    • read:user
    • user:email
    • user:follow
      admin:gpg_key:
    • read:gpg_key

Then run yarn bootstrap and add your token to the API_AUTH_TOKEN environment
variable in .env.

To test the service worker and offline functionality you may want to use ngrok and use the HTTPS endpoint provided.

Scripts

Script Description Environment
yarn bootstrap Set-up app config files development, production
yarn codegen Run graphql-codegen on API_ENDPOINT defined in .env development
yarn bootstrap Production build production
yarn serve Serve local build development
yarn start Run development build development
yarn test Run tests development, production
yarn docker:bootstrap Run bootstrap using docker development
yarn docker:build Run build using docker development
yarn docker:start Run start using docker development
yarn docker:test Run test using docker development

Tools and libraries

TODO

  • Add robust tests
    • Use react testing library
  • Implement continuous deployment
  • Add codecov
  • Add reconciliation for allow for fetch more
  • Suggest repos when none are found
  • Optimise hooks
  • Add logging service
  • Fix linter warnings
  • Add initial loading screen
  • Use intersection observer for loading more results
  • Support GitHub app auth
  • Make RepositoryItem and RepositoryDetail components generic
  • Replace emojis with icons
  • Legacy browser testing
  • Use import aliases to avoid .. relative imports