Explore Templates

Introduction

Nubra UI - A Bootstrap based library of modern, reusable and flexible components designed specially for SaaS web applications.

File Structure

We have arranged all the files as follows.

														
React-Jampack
├── 
│   └── Clssic
│   └── Horizontal
│   └── Compact
│     └── src
│     └── assets
│	  └── dist
│	      └── css
│    	      └── fonts
│    	      └── img
│    	  └── scss
│	      └── apps.scss
│	      └── drawer.scss
│	      └── footer.scss
│	      └── header.scss
│	      └── horizontal-menu.scss
│	      └── mixins.scss
│	      └── nav.scss
│	      └── navbar-menu.scss
│	      └── style.scss
│	      └── variables.scss
│	      └── vertical-classic-menu.scss
│	      └── vertical-icon-menu.scss
│   └── components
│       └── All Custom Components
│   └── config
│       └── Theme Configurations
│   └── layout
│       └── Template Layouts
│   └── redux
│   └── routes
│   └── util
│       └── Utilities functions
│   └── views
│       └── All JSX Pages Here
│   └── App.js
│       └── Main Route
│   └── index.js
│       └── Application root file
└── 	
													
CSS Folder

This folder includes style.css and other third party css files that are included in the template.

SCSS Folder
  • apps.scss: Application related Sass file
  • drawer.scss: Drawer related Sass file
  • footer.scss: Footer related Sass file
  • header.scss: Header related Sass file
  • horizontal-menu.scss: Horizontal menu Sass file
  • mixins.scss: Mixins Sass file
  • nav.scss: Nav Sass file
  • navbar-menu.scss: Navbar Sass file
  • style.scss: Master Sass file
  • variables.scss: All the variables related Sass file
  • vertical-classic-menu.scss: Vertical classic menu Sass file
  • vertical-icon-menu.scss: Vertical icon menu Sass file
Installation

To get started follow this steps.

  1. First of all it's required to Install Node and npm / yarn.
  2. You can download React-Jampack.zip file from Themeforest or other some sources, Unzip the zip file that you have downloaded from Themeforest. Inside the zip file, you will find 3 seperated projects and documentation file for documentation.
  3. Open your favorite console application (Terminal, iTerm, Command Prompt etc.). Navigate to a your favorite project layout folder (classic, horizontal or compact) and Install packages using following commands. This command will install all the required Node.js modules into the node_modules directory inside project folder. And now, you are ready to run the project for the first time.
  4. 														
    npm install
    or 
    yarn install
    													
  5. Now you can use This React project for your application development, make the necessary changes.
  6. To builds the app for production you can use below commands. It will create the build/ folder inside this project directory .It correctly bundles React in production mode and optimizes the build for the best performance. The build is minify and the filenames include the hashes. Your app is ready to be deployed.
  7. 														
    npm run build
    or 
    yarn build