React Admin Low Code

screenshot of React Admin Low Code
react

react-admin (via ra-data-hasura provider) + hasura = :)

Overview:

The React Admin Low Code is an example application built with react-admin, a configuration-based CRUD admin UI builder. This application demonstrates how to use the ra-data-hasura data provider with Hasura, an automatic GraphQL API backend on top of PostgreSQL. By combining these two technologies, users can easily build a back-office admin suite in a short amount of time. Additionally, the example application has been extended by other developers to include Docker Compose for development, Firebase for authentication, and Flyway for database migrations.

Features:

  • Integration with ra-data-hasura: The application demonstrates how to use the ra-data-hasura data provider with Hasura to connect react-admin with a GraphQL API backend.
  • CRUD Admin UI Builder: react-admin provides a configuration-based approach to building CRUD admin interfaces, making it easy to create, read, update, and delete data.
  • Flexible Authentication Options: By integrating with Firebase, the application allows for easy authentication and authorization of users.
  • Database Migration Support: The integration of Flyway enables easy management and execution of database migrations.

Summary:

The React Admin Low Code example application showcases the capabilities of react-admin, ra-data-hasura data provider, and Hasura's GraphQL API backend. It demonstrates how these technologies can be used to quickly build an admin suite with CRUD functionality. The integration with Firebase and Flyway also enhances the application by providing authentication and database migration support. Whether you are a beginner or an experienced developer, this application serves as a valuable resource for understanding and implementing a low-code solution for admin interfaces.

react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

dashboard
Dashboard

A dashboard style website template is a pre-designed layout that features a user interface resembling a control panel or dashboard. It typically includes charts, graphs, tables, and other data visualization tools that allow users to monitor and analyze data in real-time.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

graphql
Graphql

A website that uses GraphQL as a query language to manage data fetching and state management. This includes features such as a strongly typed schema, client-side caching, and declarative data fetching to streamline data management and optimize website performance.

hasura
Hasura

Hasura is a GraphQL engine that provides instant, realtime GraphQL APIs over your databases. It offers built-in authorization, event triggers, and remote schemas to help developers build scalable GraphQL backends without writing any backend code.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.

webpack
Webpack

Webpack is a popular open-source module bundler for JavaScript applications that bundles and optimizes the code and its dependencies for production-ready deployment. It can also be used to transform other types of assets such as CSS, images, and fonts.