Full-Stack Seed project generated by React App Generator top of Soft Ui Dashboard design. The backend logic is provided by a simple, easy-to-extend
API Server that manages the Authentication flow (login, registration, logout) using JSON Web Tokens
(JWT).
-
๐ React Soft UI Dashboard - LIVE Demo (from a similar product)
-
๐ Built with React App Generator, timestamp
2023-03-02 09:23
M-UI
based design crafted by Creative-TimUI Kit
: 70+ components,8 Sample Pages
,3 Customized Plugins
Compatibility matrix
using Ubuntu18.04 LTS
as reference.
NodeJS | NPM | YARN |
---|---|---|
v14.0.0 |
โ | โ |
v15.0.0 |
โ | โ |
v16.15.0 |
โ | โ |
- Stack:
Flask
/Flask-RestX
/ SQLite - DB Layer:
SqlAlchemyORM
,SQLite
persistence - Auth: JWT tokens managed via
Flask-jwt_extended
- API Definition - the unified API structure implemented by this server
Being a full-stack product, the backend and the frontend should be compiled and started separately. Before starting to compile the product, make sure you have the following tools installed in the environment:
- NodeJS - version
14.x
or higher - GIT - used to clone tjhe sources from Github
- Python3 - used in many tools
Step 1 - Once the project is downloaded, change the directory to
react-ui
.
$ cd react-ui
Step 2 - Install dependencies via NPM or yarn
$ npm i
// OR
$ yarn
Step 3 - Start in development mode
$ npm run start
// OR
$ yarn start
At this point, the app is available in the browser localhost:3000
(the default address).
Step 1 - Change the directory to
api-server-flask
$ cd api-server-flask
Step 2 - Install dependencies using a
virtual environment
$ # Virtualenv modules installation (Unix based systems)
$ virtualenv env
$ source env/bin/activate
$
$ # Virtualenv modules installation (Windows based systems)
$ # virtualenv env
$ # .\env\Scripts\activate
$
$ pip install -r requirements.txt
Step 3 - Setup the
Flask
environment
$ export FLASK_APP=run.py
$ export FLASK_ENV=development
// OR
$ (Windows CMD) set FLASK_APP=run.py
$ (Windows CMD) set FLASK_ENV=development
$
$ (Powershell) $env:FLASK_APP = ".\run.py"
$ (Powershell) $env:FLASK_ENV = "development"
Step 4 - Start the API server (development mode)
$ flask run
Use the API via POSTMAN
or Swagger Dashboard
at localhost:5000
.
< ROOT >
|
api-server-flask/
โโโ api
โ โโโ config.py
โ โโโ __init__.py
โ โโโ models.py
โ โโโ routes.py
โโโ requirements.txt
โโโ run.py
โโโ tests.py
For more components, pages and priority on support, feel free to take a look at this amazing starter:
Soft UI Dashboard is a premium React Design now available for download as a full-stack app. Made of hundred of elements, designed blocks, and fully coded pages, Soft UI Dashboard PRO is ready to help you create stunning websites and web apps.
- ๐ React Soft UI Dashboard PRO - Product Page
- โ
Enhanced UI
- more pages and components - โ
Priority
on support
- โ
React Soft Ui Dashboard - Full-Stack Seed project generated by App Generator.