https://github.com/app-generator/react-berry-dashboard-nodejs
React Berry NodeJS - Full-Stack seed project crafted on top of Berry Dashboard, React and NodeJS | App-Generator.dev
https://github.com/app-generator/react-berry-dashboard-nodejs
berry-dashboard mui-template react react-fullstack
Last synced: 3 months ago
JSON representation
React Berry NodeJS - Full-Stack seed project crafted on top of Berry Dashboard, React and NodeJS | App-Generator.dev
- Host: GitHub
- URL: https://github.com/app-generator/react-berry-dashboard-nodejs
- Owner: app-generator
- License: other
- Created: 2023-05-18T06:03:22.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2025-05-02T14:35:59.000Z (8 months ago)
- Last Synced: 2025-10-07T18:52:06.459Z (3 months ago)
- Topics: berry-dashboard, mui-template, react, react-fullstack
- Language: TypeScript
- Homepage: https://app-generator.dev/product/berry-dashboard/api-nodejs/react/
- Size: 525 KB
- Stars: 17
- Watchers: 1
- Forks: 11
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
README
# [React Node JS Berry](https://app-generator.dev/product/berry-dashboard/api-nodejs/react/)
`Full-Stack` starter generated by [App Generator](https://app-generator.dev/) on top of **[Berry Dashboard](https://app-generator.dev/product/berry-dashboard/)** design.
The backend logic is provided by a simple, `easy-to-extend` **NodeJS API Server** that manages the Authentication flow (login, registration, logout) using `JSON Web Tokens` (JWT).
The **React** Design is crafted by [CodedThemes](https://app-generator.dev/agency/codedthemes/) on top of `MUI` Library.
- 👉 [React Node JS Berry](https://app-generator.dev/product/berry-dashboard/api-nodejs/react/) - `Product Page`
- 👉 [React Node JS Berry](https://react-node-js-berry-dashboard.appseed-srv1.com/) - `LIVE Demo`
## `React` [Berry Dashboard](https://app-generator.dev/product/berry-dashboard/)
- `M-UI` based design
- Modern aesthetics UI design - Designed by *[CodedThemes](https://codedthemes.com/?ref=appseed)*
- React, Redux, Redux-persist
> `Tests` (compatibility matrix)
| NodeJS | NPM | YARN |
| --- | --- | --- |
| `v14.0.0` | ✅ | ✅ |
| `v16.0.0` | ✅ | ✅ |
| `v18.0.0` | ❌ | ❌ |
## ✨ `NodeJS API` Features
- Stack: `NodeJS` / `Express` / **SQLite**
- `TypeScript`, Joy for validation
- **DB Layer**: `TypeORM`, `SQLite` persistence
- **Auth**: Passport / `passport-jwt` strategy
- [API Definition](https://docs.appseed.us/boilerplate-code/api-unified-definition) - the unified API structure implemented by this server
> `Tests` (compatibility matrix)
| NodeJS | NPM | YARN |
| --- | --- | --- |
| `v18.0.0` | ❌ | ✅ |
| `v17.0.0` | ❌ | ✅ |
| `v16.13.0` | ❌ | ✅ |
| `v16.0.0` | ❌ | ❌ |
## ✨ How to use it
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](https://nodejs.org/en/) - version `14.x` or higher
- [GIT](https://git-scm.com/) - used to clone tjhe sources from Github
- [Python3](https://www.python.org/) - used in many tools
### 👉 Start the Frontend
> **Step 1** - Once the project is downloaded, change the directory to `react-ui`.
```bash
$ cd react-ui
```
> **Step 2** - Install dependencies via NPM or yarn
```bash
$ npm i
// OR
$ yarn
```
> **Step 3** - Start in development mode
```bash
$ npm run start
// OR
$ yarn start
```
At this point, the app is available in the browser `localhost:3000` (the default address).
### 👉 Start the Backend Server
> **Step 1** - Change the directory to `api-server-nodejs`
```bash
$ cd api-server-nodejs
```
> **Step 2** - Install dependencies via NPM or yarn
```bash
$ npm i
// OR
$ yarn
```
> **Step 3** - Run the SQLite migration via TypeORM
```bash
$ npm run typeorm migration:run
// OR
$ yarn typeorm migration:run
```
> **Step 4** - Start the API server (development mode)
```bash
$ npm run dev
// OR
$ yarn dev
```
The API server will start using the `PORT` specified in `.env` file (default 5000).
## 👉 Codebase Structure
```bash
< ROOT / src >
|
|-- config/
| |-- config.ts # Configuration
| |-- passport.ts # Define Passport Strategy
|
|-- migration/
| |-- some_migration.ts # database migrations
|
|-- models/
| |-- activeSession.ts # Sessions Model (Typeorm)
| |-- user.ts # User Model (Typeorm)
|
|-- routes/
| |-- users.ts # Define Users API Routes
|
|
|-- index.js # API Entry Point
|-- .env # Specify the ENV variables
|
|-- ************************************************************************
```
## 👉 SQLite Path
The SQLite Path is set in `.env`, as `SQLITE_PATH`
## 👉 Database migration
> Generate migration:
```bash
$ yarn typeorm migration:generate -n your_migration_name
```
> run migration:
```bash
$ yarn typeorm migration:run
```
## [React Berry Dashboard](https://app-generator.dev/product/berry-dashboard-pro/fullstack/react/) `PRO Version`
> For more components, pages and priority on support, feel free to take a look at this amazing starter:
Berry 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, Berry Dashboard PRO is ready to help you create stunning websites and web apps.
- 👉 [React Berry Dashboard PRO](https://app-generator.dev/product/berry-dashboard-pro/fullstack/react/) - `Product Page`
- ✅ `Enhanced UI` - more pages and components
- ✅ `Priority` on support
---
[React Node JS Berry](https://app-generator.dev/product/berry-dashboard/api-nodejs/react/) - Full-Stack Seed project generated by **[App Generator](https://app-generator.dev/)**.