... DASHmin ...

DASHmin is only a base for the development of your Administrative System! it still (still ;) .. does not have a range of components, but is well on the way to help you in development! By default Bootstrap is already included, if you know the basics of it,easily create your pages!

If you want to create your admin using DASHmin, follow the installation tutorial below!

✓ Requirements

To run this project, you need to have Node.js installed on your machine! If you do not have it, go to the website https://nodejs.org/en/ and download and install it as it is taught in the documentation!

✓ Instalation

git clone https://github.com/hiukky/dashmin-react.git

Install

yarn install

or

npm install

✓ Structure

├── node_modules
├── public
│   ├── favicon.ico
│   ├── index.html
│   ├── manifest.json
├── src
│   ├── app
│   ├── assets
│   ├── components
│   ├── pages
│   ├── routes
│   ├── store
│   ├── dashmin.js
│   ├── index.js
├── .editorconfig
├── .eslintrc.json
├── .gitignore
├── .travis.yml
├── package.json
├── README.md
├── LICENCE.md
├── logo.png
└── dashmin.png

✓ How to use

Dashmin is just a basic interface to help you in creating your admin dashboard. After you download and install the dependencies, you can start your application.

Configuring the Sidebar

To get started, you may be going to the src/dashmin.js file and dropping basic information in the sidebar as Brand and Buttons.

Brand

  <Sidebar
    // Brand
    brand={{
      max: 'D A S H M I N',
      min: 'dmin',
    }}
  />

Buttons

To define your buttons in the sidebar, you need to use the buttons property and pass an array of objects with their buttons, informing an id for the Id button, the name name, icone icon and the route to which it should reference route.

  <Sidebar
    // Buttons
    buttons={[
      {
        id: 1,
        name: 'Dashboard',
        icon: 'fas fa-tachometer-alt',
        route: '/',
      },
    ]}
  />

Creating the Pages

To create your pages simply go to the src/pages directory and create your pages.

pages/example.js

// Imports
import React from 'react';

// Example
const Example = () => (
  <div>
    <Title>Example</Title>
  </div>
);
export default Example;

And then immediately import them into the index file in pages/index.js.

pages/index.js

// Pages
import Example from './example';

const pages = ({
  Example,
});

export default pages;

Creating the Routes

Finally, define the routes of the application in routes/index.js.

routes/index.js

// Pages
import pages from '../pages';

// Routes
const Routes = [
  {
    route: '/',
    page: pages.Example,
  },
];

export default Routes;

Finishing

After you have followed the steps above, you can now test your application using one of the commands below.

yarn run start

or

npm run start

Ready!! if everything went well, just check your application in the browser http://127.0.0.1:3000/.

✓ Preview

✔ Demo

✓ Frameworks

✔ Bootstrap

✔ Fontawesome

✓ License

MIT © Romullo