nano vazquez @nanovazquez87
Hey guys, can't we just
copy & paste this functionality from this other app?
var React = require('react');
var ReactDOM = require('react-dom');
var Button = require('@mulesoft/anypoint-components/Button');
angular.module('cloudhub').controller('AlertsCtrl', function ($scope, ...) {
// Init scope
...
$scope.$on('$destroy', unmountReact);
(function() {
ReactDOM.render(
<Button>API Platform react button</Button>,
document.getElementById('react')
);
...
})();
...
function unmountReact() {
ReactDOM.unmountComponentAtNode(document.getElementById('react'));
}
});
import React from 'react';
import { Button } from '../../';
export default class Button extends React.PureComponent {
render() {
const {
//props
...others
} = this.props;
const props = {
'disabled': disabled || isLoading,
'className': className,
'onClick': this.handleClick,
'data-test-id': testId,
'data-anypoint-component': Button.displayName
};
return (
<button {...props}>
<span className={theme.children} display-if={children}>{children}</span>
<Spinner className={theme.spinner} size="s" display-if={isLoading} />
</button>
);
}
}
I love the idea! is there a way
I can play with them for
creating new designs?
That's nice. But we need charts, do you have charts?
(or we'll need to postpone the release)
THAT'S NICE. BUT MY TEAM NEEDs TO IMPLEMENT really COMPLEX SCENARIOS
how CAN YOU HELP us?
ok guys. We have an idea: we want a plugin system to inject apps created by hundreds of contractors, located across the globe, seamlessly. Is that what you do?
(or we'll need to postpone the release)
Shared state
App state
➜ ~ npm i -g create-react-app
➜ ~ create-react-app core-services-ui
--scripts-version=@mulesoft/react-scripts-app
➜ ~ npm i -g create-react-app
➜ ~ create-react-app core-services-base-components
--scripts-version=@mulesoft/react-scripts-library
Library using UX design
Guidelines, examples
Complex components
Common language
Common UI scenarios
zero-configuration
best practices
optimized for production
UI silos -> UI Platform
a PWA of apps
does things right (and once)
Components v1
Components v2
UI App
UI Library
UI Shell beta
UI Shell GA
Dec 2015
Sept 2017
Dec 2017
March 2017
???
and that is good
and that is bad
and that is awesome