graphql-engine/frontend

Frontend

This project was generated using Nx.

Visit the Nx Documentation to learn more about it.

This frontend monorepo contains the Hasura Console, in all the possible modes.

Last import 2023-01-12

Nx Console

It's highly recommended to install the Nx Console for VSCode, IntelliJ or Neovim.

It will allow you to have all of the Nx commands usable via UI, have an embedded view of the NX graph right in your editor, and much more.

Hasura Console

The Hasura Console is an admin dashboard to manage the connected database and to try out GraphQL APIs. It is a React application bundled with Webpack, and the state is managed mostly using Redux.

Table of contents

• Generic info
• Coming from the previous codebase
• Development Tooling
• Design System's Storybook
  • How to create/document new Components
• Cypress Dashboard
• Cypress README

How to

Install the dependencies

Run npm install.

Development server

Run nx serve console-ce (requires an .env file) for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Build

Run nx build console-ce to build the project. The build artifacts will be stored in the dist/ directory.

Running unit tests

Run nx test console-ce to execute the unit tests via Jest.

Run nx affected:test to execute the unit tests affected by a change.

Running end-to-end tests

Run nx e2e console-ce-e2e --watch (requires an .env file) to open the Cypress UI and locally working with it.

Run nx e2e console-ce-e2e (requires an .env file) to execute the end-to-end tests via Cypress.

Run nx affected:e2e (requires an .env file) to execute the end-to-end tests affected by a change.

Understand your workspace

Run nx graph to see a diagram of the dependencies of your projects.