React Native Directory

repository·main·Indexed 23 days ago

https://github.com/react-native-community/directory

A searchable catalog of libraries compatible with React Native. This repository provides documentation on adding or updating libraries via JSON or CLI, running the directory locally with Bun, and utilizing its API endpoints for searching libraries, checking compatibility, and retrieving dataset statistics.

Tokens
4.9K
Snippets
10
Records
28
Agent score
80%

What's inside React Native Directory

  1. Summary of React Native Directory API endpoints

    main

    The React Native Directory exposes several server-side JSON endpoints for accessing library data and proxies for external services:

    • GET /api/libraries: List and search libraries (paginated, sorted, filterable).
    • GET /api/libraries/check: Return metadata for a list of npm package names.
    • POST /api/libraries/check: (Deprecated) Return metadata for a list of npm package names.
    • GET /api/libraries/statistic: Aggregated statistics about the directory dataset.
    • GET /api/library: Lookup one or more libraries by npm package name.
    • GET /api/proxy/github-funding: Proxy to GitHub GraphQL API for fetching funding data.
    • GET /api/proxy/npm-stat: Proxy to npm-stat.com for download counts.
    • GET /api/proxy/unpkg: Proxy to unpkg.com with server-side redirect handling.
  2. Update site data locally with `bun data:update`

    main

    To generate site data into ./assets/data.json locally, you must provide a GITHUB_TOKEN.

    To avoid fetching/updating the store blob from Vercel and instead update the local assets/data.json file, set ONLY_WRITE_LOCAL_DATA_FILE=true in scripts/build-and-score-data.ts before running the command.

    GITHUB_TOKEN=<*> bun data:update
  3. Add a new library to the React Native Directory

    main

    To add a new library, append a new entry to the end of the react-native-libraries.json file. This ensures the library appears correctly under the "Recently added" sort option. Follow the provided JSON template and ensure you use the correct field types. If your package is in a monorepo, the name, description, and topics will be extracted from the specific package's package.json subdirectory, but GitHub stats will reflect the monorepo.

    {
      "githubUrl": "<GITHUB REPOSITORY URL>",
      "npmPkg": "<OPTIONAL NPM PACKAGE NAME>",
      "examples": [
        "<THE URL TO REPO>",
        "<THE URL TO A SNACK>"
      ],
      "images": ["<PUBLIC URL TO RELATED IMAGE>"],
      "ios": false,
      "android": false,
      "web": false,
      "windows": false,
      "macos": false,
      "tvos": false,
      "visionos": false,
      "expoGo": false,
      "fireos": false,
      "harmony": false,
      "horizon": false,
      "vegaos": false,
      "newArchitecture": false,
      "configPlugin": false,
      "unmaintained": false,
      "dev": false
    }
  4. Get aggregated dataset statistics via GET /api/libraries/statistic

    main
    Use the GET /api/libraries/statistic endpoint to retrieve aggregated statistics about the entire React Native Directory dataset, including total library counts, download metrics, and platform/package manager distributions.
    GET /api/libraries/statistic
  5. Lookup library details via GET /api/library

    main

    Use the GET /api/library endpoint to look up one or more libraries by their npm package name. You can control the depth of the response using the check parameter.

    Query Parameters

    • name: The npm package name (required).
    • check: Controls the response format:
      • false or omitted: Returns full library data (GitHub URLs, stats, npm info, etc.).
      • true: Returns only a boolean indicating if the package exists in the directory.
      • version: Returns the latest version string if the package exists in the directory.

    Usage Examples

    Full Data: GET /api/library?name=uniwind

    Existence Check: GET /api/library?name=react&check=true

    Version Check: GET /api/library?name=react&check=version

  6. Fetch package file content via unpkg proxy

    main

    Use the /api/proxy/unpkg endpoint to fetch the content of specific files from an npm package bundle via unpkg.com.

    Notes:

    • Redirects from unpkg.com are resolved server-side before the response is returned.
    • If the file content is successfully accessed, the response is returned as plain text.
    • If an error occurs, the response will be returned as JSON.
    • This endpoint is subject to the same CORS and rate limiting policies as unpkg.com.
  7. Fetch npm download statistics via proxy

    main

    Use the /api/proxy/npm-stat endpoint to retrieve download counts for an npm package over the last month. This is a simple proxy to npm-stat.com and does not perform data processing.

    Note: This endpoint is subject to the same CORS and rate limiting policies as npm-stat.com.

  8. Fetch GitHub project funding data via proxy

    main

    Use the /api/proxy/github-funding endpoint to retrieve funding information (such as GitHub Sponsors or Buy Me a Coffee links) for a specific GitHub repository. This endpoint acts as a proxy to the GitHub GraphQL API using a pre-defined query.

    Note: This endpoint is subject to the same CORS and rate limiting policies as the original api.github.com/graphql.

  9. Check library compatibility via POST /api/libraries/check (Deprecated)

    main

    ⚠️ Deprecated

    This endpoint is deprecated and will be removed in the future. Use the GET /api/libraries/check endpoint instead.

    This endpoint returns compatibility metadata for a list of npm package names provided in a JSON body.

    Body Parameters

    • packages: An array of npm package names (required).

    Example Request Body:

    { "packages": ["react-native-reanimated"] }
    POST /api/libraries/check
    Content-Type: application/json
    
    { "packages": ["react-native-reanimated"] }