/Javascript/React/How to use adminlte in reacts

How to use adminlte in reacts

import React, { Component } from 'react';
import AdminLTE, { Sidebar, Content, Row, Col, Box, Button } from 'adminlte-2-react';

const { Item } = Sidebar;

class HelloWorld extends Component {
  state = {}

  render() {
    return (<Content title="Hello World" subTitle="Getting started with adminlte-2-react" browserTitle="Hello World">
      <Row>
        <Col xs={6}>
          <Box title="My first box" type="primary" closable collapsable footer={<Button type="danger" text="Danger Button" />}>
            Hello World
          </Box>
        </Col>
        <Col xs={6}>
          <Box title="Another box">
            Content goes here
          </Box>
        </Col>
      </Row>
    </Content>);
  }
}

class App extends Component {

  sidebar = [
    <Item key="hello" text="Hello" to="/hello-world" />
  ]

  render() {
    return (
      <AdminLTE title={["Hello", "World"]} titleShort={["He", "we"]} theme="blue" sidebar={this.sidebar}>
        <HelloWorld path="/hello-world" />
      </AdminLTE>
    );
  }
}

export default App;

Source: npmjs.com

Similar codes

1 vote133 views1 answer
React native blur view crashing on android
Javascript React
24 votes137 views5 answers
React map array
Javascript React
16 votes147 views3 answers
Start react native
Javascript React
16 votes83 views1 answer
How to insern an image in react
Javascript React
1 vote131 views1 answer
Firebase react router page not found on page refresh
Javascript React
0 vote135 views1 answer
React time input
Javascript React
15 votes139 views5 answers
React svg
Javascript React
4 votes137 views2 answers
Google map react search place
Javascript React
3 votes169 views2 answers
Whatare portals in react
Javascript React
1 vote134 views1 answer
Tab navigation react-native without title
Javascript React