Developer Portal File Structure

Within the project, you will see three subfolders: my-dev-portal, my-dev-portal-api, and my-dev-portal-authorizer. For the project to work, both the my-dev-portal and my-dev-portal-api applications must be running.

The my-dev-portal folder is a React application that contains the UI and logic for the developer portal. Any additions to the UI, styling or branding changes, and other user-facing changes will be done within this folder/project. Here are some specifics about what some key files/folders contain:

  • src/components
    • This folder contains all of the react UI elements.
  • src/styles
    • This folder contains all of the front-end styles.
  • src/App.js
    • This file contains the application code to bring up the node project.
  • src/provider.js
    • These provider files, such as OktaProviderWithNavigate or StripeProvider are React providers which inject core functionalities from each of these platforms into the React app.

The my-dev-portal-api project is where the APIs and various other logic are contained. In this project, you’ll have connectivity to Moesif, Stripe, and Kong through various APIs. For example, the /register endpoint in this project contains the logic used to register a new user in the various systems that are part of the developer portal ecosystem.

  • app.js
    • This file contains all of the core API endpoint code and other business logic.

The my-dev-portal-authorizer project is where the AWS Authorizer code is contained. In this project, you’ll have the base code for the AWS authorizer as well as the code for the Auth0 Action and some other configuration items (all covered in detail in the docs). For example, the /register endpoint in this project contains the logic used to register a new user in the various systems that are part of the developer portal ecosystem.

Updated: