/tutorhub-frontend

Primary LanguageSCSSOtherNOASSERTION

Datta Able is an open-source React Dashboard that provides a colorful and modern design. Datta Able React Free is the most stylised React Free Admin Template, around all other admin templates in the market. It comes with high feature-rich pages and components with fully developer-centric code. The product comes with a simple JWT authentication flow: login/register/logout.


🚀 PROMO Spring Boost Campaign 50%OFF

The discount is applicable to all products and licenses (no stock limits) until 15.MAR

Spring Boost Campaign


🚀 Built with React App Generator

  • ✅ Modern aesthetics UI design - Designed by CodedThemes
  • ✅ React, Redux, Redux-persist
  • ✅ Authentication: JWT Login/Register/Logout
  • ✅ Full-stack ready using Node JS API Server (open-source project)
    • Features: Typescript / SQLite / TypeORM / Joy (validation) / Passport library - passport-jwt strategy.

Tests

Compatibility matrix tested with Render API Wrapper.

NodeJS NPM YARN
v14.0.0
v16.0.0
v18.0.0

React Datta Able - Full-stack product powered by a simple NodeJS API backend.


✨ Quick Start in Docker

Get the code

$ git clone https://github.com/app-generator/react-datta-able.git
$ cd react-datta-able

Start the app in Docker

$ docker-compose up --build 

The React UI starts on port 3000 and expects an API server on port 5000 (saved in configuration).


Note: This product can be used with other API Servers for a complete fullstack experience. ALL API servers use an unified interface


✨ How to use it

To use the product Node JS (>= 12.x) is required and GIT to clone/download the project from the public repository.

Step #1 - Clone the project

$ git clone https://github.com/app-generator/react-datta-able.git
$ cd react-datta-able

Step #2 - Install dependencies via NPM or yarn

$ npm i
// OR
$ yarn

Step #3 - Start in development mode

$ npm run start 
// OR
$ yarn start

✨ Configure the backend server

The product comes with a usable JWT Authentication flow that provides only the basic requests: login/logout/register.

API Server URL - src/config/constant.js

const config = {
    ...
    API_SERVER: 'http://localhost:5000/api/'  // <-- The magic line
};

API Server Descriptor - POSTMAN Collection

The API Server signature is provided by the Unified API Definition

  • API POSTMAN Collection - can be used to mock (simulate) the backend server or code a new one in your preferred framework.

✨ Node JS API Server

The product is also open-source and is already configured to work with Berry Dashboard Template - product features:

  • Typescript / Node js / Express server
  • JWT authentication (passport-jwt strategy)
  • Persistence: SQLite

Links


Node JS API - Open-source API server built on top of Express Nodejs Framework.


Compile the API Server

Step #1 - Clone the project

$ git clone https://github.com/app-generator/api-server-nodejs.git
$ cd api-server-nodejs

Step #2 - Install dependencies via NPM or Yarn

$ npm i
// OR
$ yarn

Step #3 - Run the SQLite migration via TypeORM

$ yarn typeorm migration:run

Step #4 - Start the API server (development mode)

$ npm dev
// OR
$ yarn dev

The API server will start using the PORT specified in .env file (default 5000).



React Node JS Datta Able - Provided by CodedThemes and AppSeed App Generator.