Skip to content

[Proposal] Draft version for vision of react-cli [Code name: Hudini] #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
73 changes: 73 additions & 0 deletions Proposal-A.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,73 @@
# Proposal A - React-GUI

## Introduction

> This is the simple introduction how **React-GUI** will help the community in building robust webapps in less time.

### Scope

The proposal covers most of the pre-requisites that we'll need to before we build this library
Things you'll need:

- React
- Redux
- RollUp

### Goals
- A gui to make components to reduce writing recundant code
- All build configuraton will be configurable
- There will be no abstractions likely other libraries creat-react-app -all generated files will be available in structured app

#### Features

- GUI will run on localhost
- React Components Interface :
- There will be toggle to check whether to make it stateful or stateless
- Checkboxes will be added to include lifyCycles method optioanlly
- An example how resultant component will look like:

```jsx
class ReactGuiComponent extends Component {
state={}

componentWillMount() {
// write implementation
}

componentDidMount() {
// write implementation
}

static getDerivedStateFromProps(nextProps, prevState) {
// write implementation
}

componentDidMount() {
// write implementation
}

render() {
return(
"Welcome to React GUI"
)
}

}

export default ReactGuiComponent
```
- Named and default export configurable

- Redux Interface
- Actions and reducer will be created with a little configuration in GUI
- Which components are to be connected with `connect()`, can be configured through GUI

## Parent - Child relationship visualisation:

- User can make Parent-Child relation with drgaggable option
- A visualisation library like `React-dnd`, `d3` can be integrated
- This all can be implemented for reducers and components.

> The goal is to make apps more concise and user will only focus on logic implmentation. Our target is to make clean code and readable. There's a big misconeption in the community when begginers decide to build a webapp from scratch. All code will be generated with comments so user everyone can leverage. Our ultimate goal is to provide a basic boilerplate so user can just pick the app name and start coding.