/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

0 vote432 views1 answer
How to use radio buttons in react class-based components
Javascript React
5 votes407 views2 answers
React js download file
Javascript React
0 vote339 views1 answer
Create-react-app height issues with flex
Javascript React
4 votes340 views1 answer
React router dom v6 goback
Javascript React
1 vote386 views1 answer
How to clear pod cache in react native
Javascript React
0 vote396 views1 answer
How to install yup in react native
Javascript React
0 vote427 views1 answer
Check scroll top height in react js
Javascript React
12 votes340 views3 answers
React form hook npm
Javascript React
11 votes371 views5 answers
React router refresh page
Javascript React
1 vote379 views1 answer
Import json file in react native
Javascript React