Skip to content

app-generator/react-material-kit

Folders and files

NameName
Last commit message
Last commit date
Dec 3, 2022
Dec 5, 2022
Dec 5, 2022
Dec 5, 2022
Dec 4, 2022
Dec 3, 2022
Dec 5, 2022
Dec 5, 2022
Dec 3, 2022
Dec 5, 2022

Repository files navigation

Start your Development with an Innovative Admin Template for Material-UI and React. Material Kit 2 React is built with over 40 frontend individual elements, like buttons, inputs, navbars, alerts or cards, giving you the freedom of choosing and combining. The product comes with a simple JWT authentication flow: login/register/logout.


πŸš€ Built with React App Generator

  • βœ… Innovative Material Kit Design - Crafted by Creative-Tim
  • βœ… React, Redux, Redux-persist
  • βœ… Full-stack ready using Node JS API Server (open-source project)
    • Features: Typescript / SQLite / TypeORM / Joy (validation) / Passport library - passport-jwt strategy.

Material Kit - Starter generated by AppSeed.


Tests

Compatibility matrix using Ubuntu 18.04 LTS as reference.

NodeJS NPM YARN
v14.0.0 βœ… ❌
v15.0.0 βœ… ❌
v16.15.0 βœ… βœ…

✨ How to use it

To use the product Node JS (>= 14.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-material-kit.git
$ cd react-material-kit

πŸ‘‰ Step #2 - Install dependencies via NPM or yarn

$ npm i
// OR
$ yarn

πŸ‘‰ Step 3 - Edit the .env using the template .env.sample.

REACT_APP_BACKEND_SERVER='http://localhost:5000/api/'

πŸ‘‰ Step #4 - 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 Material Kit - Provided by AppSeed.