Doar – Responsive React Admin Template

Introduction

Template Name: Doar – Responsive React Admin Template

Thank you very much for choosing our template. We truly appreciate and really hope that you'll enjoy our template!
If you like this template, Please support us by rating us 5 stars..

Doar - Responsive React Admin Template would be ideal for you if you are a react developer or a react website owner who requires working within a dashboard. It gives you numerous options and possibilities that will get you going in little to no time. This modern responsive React admin template is adorned with heaps of material for a speedy outcome that will turn heads.

Dashboards are a great way to get an overview of your business and how it is performing. You can easily monitor and measure performance and metrics in real-time while making sure that you are on top of the latest trends and data points. It will also help you build the app's administration without spending precious hours doing so elsewhere. Therefore, if you are looking for a state-of-art and well-functional React-based admin template, Doar - Responsive React Admin Template will be the right choice.

Since Doar is built in React platform within Lerna Monorepo architecture, this template is more intuitive, more adaptive, and, needless to say, so much easier to customize. The global state of this admin template is managed by Redux. This unique admin dashboard template comes with many reusable components designed to look neat and organized, and all the components are written in strict typescript. Since it contains Bulletproof UI Components with Storybook, you can preview and modify each state in the component independently with less effort. With all these components, you have ample options for building just the right dashboard you need for your application.

You will save a lot of time going from prototyping to full-functional code while using Doar - Responsive React Admin Template because all elements are implemented. This Dashboard template is available with prebuilt examples, so the development process is seamless, and switching between pages on your website couldn't be simpler!

One of the greatest specialties of this React template is its full responsiveness, by which it can adapt to any screen. Therefore it would be the perfect choice for designing a website that looks great on smartphones and tablets!

That's not all; Doar is equipped with 04 Pre-built Dashboard Templates, 05 unique apps, Google Font & Custom Font, Font-Awesome & React Feather icon, interactive Maps, React hooks, Beautiful Chats Made by ChartJS and Apexcharts, etc. With all these features, this template is the perfect solution for your business needs.

Calendar, Chat, File Manager, Mail are some of the highlights of Doar - Responsive React Admin Template. You can display sales monitoring, website analysis, cryptocurrency, helpdesk management, etc.

Doar is the ultimate template for all your admin needs. You get a lifetime of free updates and six months of dedicated support from start to finish! Doar will work with any web application or project you need, so make an immediate difference in your business today by starting things off on the right track with this incredible responsive admin template.

By: HasThemes
URL: https://hasthemes.com/
HelpDesk: https://hasthemes.com/contact-us/

Template features

Build on React Platform (v18.0.2)
Lerna Monorepo Architecture
Bulletproof UI Components with Storybook
All Components are written in Strict Typescript
Global State Managed by Redux
Components Build On Styled Components & Styled System
Reuseable Components
Form Validation Check by React Hook Form
Beautiful Chats Made by ChartJS and Apexcharts
Interactive Maps
React Hooks used
No jQuery Dependency
4 Unique Home Versions
5 Unique Apps
Responsive Layout
Google Font & Custom Font
Font-Awesome & React Feather icon
Fully compatible for all major browsers such as Firefox, Safari, Chrome, Vivaldi, Microsoft Edge
Well Documented
100% valid W3 web standards.
Beautiful and Unique Design
Life Time Free Update
Amazing 5 stars support
Best Developer Experience
and Much More…

Need Support?

If you have any questions regarding to theme issues, please submit a ticket at https://hasthemes.com/contact-us/

Files Included

Documentation
Template Files - (doar-tf-react-v1-downloadable.zip)

Node.js, Yarn and Lerna

Your computer must have installed nodejs and yarn to run this template. You can download Node.js from https://nodejs.org and yarn from https://yarnpkg.com/lang/en/docs/install/ . NPM comes bundled with Node.js

Install Yarn.

Install Lerna.

This project is managed by lerna. So, You must have to install lerna.

Install Npm Packages.

You must have to install packages. You can do this by running yarn bootstrap from the root of your project to install all the necessary dependencies.

Main Template's Development server

Run yarn start:main from the root of your project to start a dev server. Navigate to http://localhost:3008/. The app will automatically reload if you change any of the source files.

Main Template's Build

Run yarn build:main to build the project. The build artifacts will be stored in the packages/main/build/ directory.

Main Template's Static Server

Run yarn serve:main this command will serve your static site on the port 5000 (Note: Run this after build)

UI Element Package's Development Server

Run yarn storybook from the root of your project to start UI Element Package's Development Server. Navigate to http://localhost:9001/. The app will automatically reload if you change any of the source files.

UI Storybook Build

Run yarn build-storybook to build UI Element Package. The build artifacts will be stored in the packages/components/public/ directory.

UI Element Package's Static Server

Run yarn serve-storybook to run UI Element's Static Server. Navigate to http://127.0.0.1:8080

UI Elements Package Build

Run yarn build:components to build Element package. The build artifacts will be stored in the packages/components/dist/ directory. Usually, it will be build with yarn bootstrap. But, you have to build it if you change anything in elements pacakge.

Fix Linting and Prettier Error

We have used eslint and prettier to manage and format our coding style. If you have any linting error Run yarn lint:fix to fix eslint error.

Clean App

Run yarn clean will remove your node_modules and other unnecessary files

Check root's pacakge.json file to learn about other script

Some Important Lerna Scripts

Add npm package to a local package


			lerna add npm_pacakge --scope=local_package


			lerna add npm_pacakge --scope=local_package -D

Example:


			lerna add moment --scope=@doar/main

Remove npm package from a local package


			lerna exec --scope=local_package yarn remove npm_package

Example:


			lerna exec --scope=@doar/main yarn remove moment

Root Folder Structure

Packages Folder Structure

There are 3 packages here, they are components, main and shared. Components package is for UI Elements which is built on storybook. Our main template is in main package. And all shared files and functions is in shared package.