https://github.com/vip-git/cra-react-jsonschema-form-material-ui-example
This is a small demo project showcasing compatibility of react-jsonschema-form with CRA
https://github.com/vip-git/cra-react-jsonschema-form-material-ui-example
Last synced: 12 months ago
JSON representation
This is a small demo project showcasing compatibility of react-jsonschema-form with CRA
- Host: GitHub
- URL: https://github.com/vip-git/cra-react-jsonschema-form-material-ui-example
- Owner: vip-git
- Created: 2021-05-28T19:48:35.000Z (about 5 years ago)
- Default Branch: main
- Last Pushed: 2022-07-02T06:09:13.000Z (almost 4 years ago)
- Last Synced: 2025-07-02T21:04:21.481Z (12 months ago)
- Language: JavaScript
- Homepage: https://cra-react-jsonschema-form-material-ui-example.vercel.app/
- Size: 423 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## CRA - React JSONSchema Form Material UI - Example
This is a small demo project showcasing compatiblity of [CRA](https://github.com/facebook/create-react-app) with [react-jsonschema-form-material-ui](https://github.com/vip-git/react-jsonschema-form-material-ui)
```bash
yarn
npm start
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
#### Example Code can be [seen here](./src/App.js)
```jsx
import React from 'react';
import MaterialJsonSchemaForm from 'react-jsonschema-form-material-ui';
import schema from '../simple/schema.json';
import uiSchema from '../simple/ui-schema.json';
import givenFormData from '../simple/form-data.json';
const theme = {
palette: {
primary: {
light: '#757ce8',
main: '#3f50b5',
dark: '#002884',
contrastText: '#fff',
},
secondary: {
light: '#ff7961',
main: '#f44336',
dark: '#ba000d',
contrastText: '#000',
},
},
};
export default () => {
const [formData, setFormData] = React.useState(givenFormData);
return setFormData(formData)}
onSubmit={() => console.log('form submitted')}
/>;
};
```