Documentation

Omah - React Redux Property Admin Dashboard Template

Omah

Real Estate Admin Dashboard Template

This documentation is last updated on 14 December 2023

Thank you for purchasing this HTML template.

If you like this template, Please support us by rating this template with 5 stars


React.JS Installation & Setup -

1.- Install Node.js

To compile Sass via the command line first, we need to install node.js. The easiest way is downloading it from the official website nodejs.org open the package and follow the wizard.

2.- NPM Install

NPM is the Node Package Manager for JavaScript. NPM makes it easy to install and uninstall third party packages. To initialize a Sass project with NPM, open your terminal and CD (change directory) to your project folder.

npm install

It will create 'node_module' folder in this all dependency files will be install with this command.

3.- Run Project

With is command file will be compiled and it will be loaded on local server `http://localhost:3000`: npm start

npm start
4.- Production Build

Node-sass is an NPM package that compiles Sass to CSS (which it does very quickly too). To install node-sass run the following command in your terminal npm run build


Sass Compile -

1.- Run the Script

To execute our one-line script, we need to run the following command in the terminal: npm run sass

npm run sass

Folder Directories -

  • images

    This folder contains all the images of Omah template.

  • fonts

    This folder font files for various template features.

  • css

    This folder contains all the CSS files of Omah template.

  • component

    This folder has all component files.

  • jsx

    This folder has all file used in the template.

  • scss

    Scss File


Folder Structure -

  • public
    • index.html
  • src
    • context
      • ThemeContext.js
      • ThemeDemo.js
    • css
    • icons
      • avasta
      • feather
      • flaticon
      • font-awesome-old
      • helveticaNeue
      • icomoon
      • line-awesome
      • material-design-iconic-font
      • simple-line-icons
      • themify-icons
    • images
      • avatar
      • big
      • browser
      • card
      • contact
      • demo
      • pattern
      • product
      • profile
      • tab
      • table
    • jsx
      • components
        • AppsMenu
        • bootstrap
        • charts
        • chatBox
        • Dashboard
        • Forms
        • PluginsMenu
        • table
      • layouts
        • nav
          • Header.js
          • NavHader.js
          • SideBar.js
        • ChatBox
        • EventSidebar.js
        • Footer.js
        • PageTitle.js
        • Setting.js
      • pages
        • Error400.js
        • Error403.js
        • Error404.js
        • Error500.js
        • Error503.js
        • ForgotPassword.js
        • LockScreen.js
        • Login.js
        • Registration.js
        • Widget.js
      • index.js
    • scss
      • abstracts
      • base
      • components
        • app
        • charts
        • forms
        • ico
        • map
        • tables
        • uc
        • ui
        • widget
      • layout
        • footer
        • header
        • rtl
        • sidebar
        • theme
        • typography
        • version-dark
        • version-transparent
      • pages
      • main.scss
    • services
      • AuthService.js
      • AxiosInstance.js
      • PostsService.js
    • store
      • actions
      • reducers
      • selectors
      • store.js
    • vendor
      • animate
      • aos
      • bootstrap-select
      • bootstrap-v4-rtl
      • deznav
      • metismenu
      • perfect-scrollbar
    • App.js
    • index.js
  • package.json

Credits -

List of web development libraries and plugins:


Project Main Features -

  • Redux
  • Bootstrap
  • Built in SASS
  • Fully Responsive
  • Ready to used widget
  • Detailed Documentation
  • Attractive Calendar
  • Invoice
  • User Profile
  • Timeline
  • CkEditor
  • Form Examples
  • Many Charts Options
  • Form Validation
  • Input Slider
  • Advanced Form Elements
  • Form Wizard
  • Social
  • Bootstrap
  • Datatable
  • Table Sorting
  • React Table
  • Date Picker
  • Dark Mode
  • Sweetalert
  • Toaster
  • Lightbox
  • Scroll
  • Chatbox
  • Router

Main Content -

Index.js Structure File

import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App";
import { BrowserRouter } from 'react-router-dom';
import {Provider} from 'react-redux';
import {store} from './store/store';
import reportWebVitals from "./reportWebVitals";
import  ThemeContext  from "./context/ThemeContext"; 

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<React.StrictMode>
 <Provider store = {store}>
  <BrowserRouter basename='/react/demo'>
   <ThemeContext>
	<App />
   </ThemeContext> 
  </BrowserRouter>  
 </Provider>	
</React.StrictMode>,
);
reportWebVitals();

Create Page -

Exmaple to create page

import React from "react";	
export function MyPage() {
 return(
   <h4>Hello!</h5>
 ) 
}

Do You Need Help To Customization

After Purchase A Template...

You Will Start Customizing According Your Requirement but what if you don't know

SOLUTION IS HIRE DexignZone

Hire Same Team For Quality Customization

In Order To Ensure Your Website Is Live, We Will Customize The Template According To Your Requirements And Upload It to the Server.

Version History - #back to top

v2.0 - 15 December 2023
  • Added
    1. Included all required Property Pages for searching and related property detail.
      1. Property details page
      2. Property list page
      3. Add property page
    2. Included all Agent Pages, to deal with property.
      1. Add agent page
      2. Add agent wizard page
      3. All agents page
      4. Agent profile page
    3. Included CMS page for Content management system.
      1. Content page
      2. Content add page
      3. Menu page
      4. Email Template page
      5. Add Email page
      6. Blog page
      7. Add blog page
      8. Blog category page
    4. Flaticon integration now available for enhanced design options and resources.
    5. Svg Icons integration now available for enhanced design options and resources.
  • Update
    1. Compatible with React 18+ & Node 18+
    2. Update Dependency Plugins
    3. Update Router Dom 6 Version
    4. Flaticon integration now available for enhanced design options and resources
    5. SVG Icon integration now available for expanded design options and resources.
    6. Updated Chart JS library for enhanced data visualization capabilities
    7. SweetAlert2 for Attractive and customizable pop-up alerts
    8. Light Gallery Enhanced performance, customizable features for a superior user experience.
    9. Documentation Revised and enhanced for better understanding
  • Design Update
    1. Email page new features a left sidebar for mobile size.
  • Bug Fixed
    1. Design issues resolved for consistent, polished visuals.
    2. Improved Sidebar and Header Style
v1.2 - 27 December 2021
  • Update
    1. Added Redux login and Redux Form wizard functionality
    2. Added Create filtering and sorting table page using React Table
    3. Added Task page with add, edit and delete functionality
    4. Added Rating functionality
    5. Update Update CSS and JS code for designing
v1.1 - 9 April 2021
  • Update
    1. Resolve design issues
    2. Added PSD / Figma Files with Package
    3. Added HTML Files with package
v1.0 - 26 Febuary 2021
    1. New - Created & Upload Omah