Tushan It is a highly free, React-based, out-of-the-box background management application front-end framework.

As a developer, you can quickly create a usable background management framework just like calling a library

A simpleTushan The application will probably look like this:

import {
  createTextField,
  createEmailField,
  createUrlField,
  jsonServerProvider,
  ListTable,
  Resource,
  Tushan,
} from 'tushan';

const dataProvider = jsonServerProvider('https://jsonplaceholder.typicode.com');

function App() {
  return (
    <Tushan
      basename="/admin"
      dataProvider={dataProvider}
    >
      <Resource
        name="users"
        label="User"
        list={
          <ListTable
            fields={[
              createTextField('id', {
                label: 'ID',
              }),
              createTextField('name', {
                label: 'Name',
                list: {
                  sort: true,
                },
              }),
              createEmailField('email', {
                label: 'Email',
              }),
              createUrlField('website', {
                label: 'Website',
              }),
            ]}
            action={{ create: true, detail: true, edit: true, delete: true }}
          />
        }
      />
    </Tushan>
  );
}

export default App;

We can determine the presentation form of the data table by specifying the type of the field, and built-in operations such as adding, deleting, modifying, and checking are implemented. Help developers quickly produce an MVP for backend applications.

The preview effect is as follows:

Tushan’s api design is influenced by react-admin It is very inspiring that the interface protocols of the two are fully compatible, which means that react-admin’s ready-made back-end interface ecological solution can be completely seamlessly used by Tushan.If you are interested in the background solution of material-ui design, you can choose react-admin as an alternative

in addition,Tushan Also includes some commonly used front-end dependencies such as styled-components and arco-design etc., which can help you build the front-end interface faster.

Quick example in CodeSandbox​

access Code Sandbox Quickly get sample programs without backend versions.

UI framework​

Tushan The UI component library is based on ByteDance arco-design.you can athereaccessarco-designThe official documentation for

All components are exported and available viatushandirect import