OctoTread is a web app that uses the GitHub API to show you the most starred projects on GitHub over the last day, week, or month.
There are a few existing projects and web apps that do something similar to this. The GitHub trending page allows you to see which projects were given the most stars over a period but there is no way to browse historical trending data.
GitHunt, which is the inspiration for this project, allows one to look at the historical data but has a limited query to the GitHub search API. You can only filter on languages and only the first 30 projects are shown for a period.
- Support for most search query qualifiers in the GitHub repository search API. These can be customized using the search filters dropdown.
- Pagination support for each period that is loaded as well as the items loaded per page.
- Uses the GitHub GraphQL API which should theorically result in quicker responses.
Note: GitHub requires an access token to use the GraphQL API. This is not the case with the REST API, where you are allowed to access public entities without a token. I'll probably look into adding an option to use the REST API to mitigate this.
OctoTread uses vite for building and bundling.
npm ito install dependenciesnpm run devto start the dev servernpm run previewandnpm run buildto create a preview or bundle of the production environment respectivelynpm run graphql-codegento generate GraphQL-related hooks and classes. This needs to be done whenever a*.graphqlfile is modifiednpm run testto run all tests
Additionally, linting has been configured with eslint and prettier. Use your IDE's linter integration to automatically format the file being modified. Alternatively, use npm run lint to lint files manually.
- MUI for components and styling
- Redux, RTK, and RTK Query for state management and API querying logic
- GraphQL code generation is done using the
@graphql-codegenlibrary along with the necessary extensions - Vitest and React testing library for tests
- Azure functions to handle GitHub OAuth