You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
<SubHeading> Premium Material-UI Dashboard designed by CodedThemes, coded as a full-stack product</SubHeading>
11
9
12
-
Full-stack version of **Berry Dashboard PRO**, a premium design crafted by **CodedThemes** now usable with multiple API Backend Servers: **Node JS**, Flask, Django. The UI comes with pre-configured **JWT authentication** powered by a [Unified API Interface](../../boilerplate-code/api-server/api-unified-definition.mdx) that makes this product compatible with more than one backend: Node JS, Flask, Django (FASTapi coming soon).
10
+
Full-stack version of **[Berry Dashboard PRO](https://appseed.us/product/berry-dashboard-pro/full-stack/)**, a premium design crafted by **CodedThemes** now usable with multiple API Backend Servers:
11
+
**Node JS**, Flask, Django.
12
+
The UI comes with pre-configured **JWT authentication** powered by a [Unified API Interface](../../boilerplate-code/api-server/api-unified-definition.mdx)
13
+
that makes this product compatible with more than one backend: Node JS, Flask, Django.
@@ -26,59 +28,62 @@ To successfully compile and use the product, please make sure your workstation h
26
28
- A code editor: [VsCode](https://code.visualstudio.com/) or [Atom](https://atom.io/)
27
29
- Ability to work in the terminal window
28
30
31
+
29
32
## Product Features
30
33
31
34
The product aims to help developers skip over the basics and start faster a new full-stack product already enhanced with authentication, a pixel-perfect UI powered by production-ready backends. The fact that makes this full-stack product unique is the **JSON-API** compliance over multiple servers:
46
+
43
47
44
48
## **How to use the product**
45
49
46
50
Full-stack React Material Dashboard is built using a two-tier architecture where the UI is decoupled from the backend API server and communicates using requests secured by **JWT tokens**. The recommended way to start using this full-stack product is to follow a simple setup:
47
51
48
52
- Step #1 - Build and start the backend server
49
-
- Step #2 - Build and start the UI
53
+
- Step #2 - Build and start the React UI
50
54
- Create a new user via the registration page
51
55
- Authenticate and access the private pages
52
56
- Add your magic on top of the existing codebase.
53
57
54
-
## Start the backend server
55
58
56
-
As mentioned before, the UI is configured to work with many backend servers that share a common API interface: [Django](../../boilerplate-code/api-server/django.mdx), [Node JS](../../boilerplate-code/api-server/node-js.mdx), [Flask](../../boilerplate-code/api-server/flask.mdx). Based on your license (free or commercial) the access is granted to the request API Server. On this page, we will compile and start the free version of Node JS API (open-source product).
59
+
## Start the Backend API
57
60
58
-
> Start [Node JS API Server](../../boilerplate-code/api-server/node-js.mdx) - open-source version
61
+
As mentioned before, the UI is configured to work with many backend servers that share a common API interface: [Django](../../boilerplate-code/api-server/django.mdx),
Based on your license (free or commercial) the access is granted to the request API Server. On this page, we will compile and start the free version of Node JS API (open-source product).
**Step #2 - Install dependencies** via NPM or Yarn
72
+
> 👉 **Step #2** - Install dependencies via NPM or Yarn
68
73
69
74
```
70
75
$ npm i
71
76
// OR
72
77
$ yarn
73
78
```
74
79
75
-
**Step #3 - Run the SQLite migration** and create the required tables
80
+
> 👉 **Step #3** - Run the SQLite migration
76
81
77
82
```
78
83
$ yarn typeorm migration:run
79
84
```
80
85
81
-
**Step #4 - Start the API server** - development mode
86
+
> 👉 **Step #4** - Start the API server
82
87
83
88
```
84
89
$ npm dev
@@ -97,26 +102,28 @@ The API interface used by the API is a simple JWT authentication layer that expo
97
102
98
103
At this point, the backend API should be & and running on address: `http://localhost:5000` and we can move on with the setup and build the React UI.
99
104
105
+
100
106
## Start the React UI
101
107
102
-
The **React Material Dashboard** being a commercial product, a license is required before getting access to the source code. In case you don't have a license, please access the product page and purchase one.
108
+
The **React Berry Dashboard** being a commercial product, a license is required before getting access to the source code.
109
+
In case you don't have a license, please access the product page and purchase one.
103
110
104
-
**Step #1** - Clone the project (**private repository**)
**Step #2** - Install dependencies via NPM or yarn
118
+
> 👉 **Step #2** - Install dependencies via NPM or yarn
112
119
113
120
```
114
121
$ npm i
115
122
// OR
116
123
$ yarn
117
124
```
118
125
119
-
**Step #3** - Start in development mode
126
+
> 👉 **Step #3** - Start in development mode
120
127
121
128
```
122
129
$ npm run start
@@ -137,6 +144,14 @@ const config = {
137
144
138
145
## Berry Dashboard - UI Information
139
146
140
-
**Berry** is `developer-friendly` & highly customizable React Admin Template based on [Material-UI](http://material-ui.com/). This modern design comes with plenty of ready-to-use Material-UI components that will help you to build your site faster and saves your development time.
147
+
**Berry** is `developer-friendly` & highly customizable React Admin Template based on [Material-UI](http://material-ui.com/).
148
+
This modern design comes with plenty of ready-to-use Material-UI components that will help you to build your site faster and saves your development time.
149
+
150
+
0 commit comments