# Getting Started
Welcome to the documentation for Nzoni Boilerplate! This guide will walk you through the setup, configuration, and usage of Nzoni, a robust SaaS boilerplate designed to accelerate your web application
Make sure you have **node v18**+ and **npm v10+**
## Download repositories
Once you've purchased Nzoni, your github email account will be added to the related projects.\
Make sure you're already connected to github on your cli terminal or use Github Personal access token.
### Download Angular repository
```sh
git clone https://github.com/nzoni-app/nz-angular.git
```
### Download Nest.js repository
## Installation
#### Install Node.js (if you haven't already)
If you haven't installed Node.js yet, you can follow the instructions [here](https://nodejs.org/en/learn/getting-started/how-to-install-nodejs).
#### Install Node Modules for Angular project
Navigate to the downloaded Angular project repostiory:
```sh
cd nz-angular
npm install
```
#### Install Node Modules for Nest.js project
Navigate to the downloaded Nest.js project repostiory:
```sh
cd nz-nestjs
npm install
```
## Configure Environment Variables
### Nest.js environnement
Nest.js supports environment variables out of the box. You can set defaults in .env (for all environments), .env.development (for development), and .env.production (for production).
By default, there is the .env.example file. Rename it to .env modify variables
```sh
ENV=developpement # OR production OR stagging
# Typeorm configuration for migration
TYPEORM_CONNECTION=postgres
TYPEORM_HOST=localhost
TYPEORM_PORT=5432
TYPEORM_USERNAME=
TYPEORM_PASSWORD=
TYPEORM_DATABASE=
TYPEORM_SYNCHRONIZE=false
TYPEORM_ENTITIES=src/**/*.entity.ts
TYPEORM_MIGRATIONS_TABLE_NAME=migrations
TYPEORM_MIGRATIONS_DIR=migrations
TYPEORM_MIGRATIONS=migrations/*.ts
# MAILING
SMTP_HOST=
SMTP_PORT=
SMTP_SECURE=false
SMTP_AUTH=
SMTP_PASSWORD=
SMTP_FROM='"Support name" '
MODERATION_MAIL=
# Logs
APP_DEBUG=true
JOB_ERROR_LOG_PATH='./'
DEFAULT_LOG_PATH='./logs'
# JWT
JWT_SECRET=A/iQ2KX0auTZZBwsbPEGC8H3a78HiiL23WD4S+QAoEq34LdeJ9aPrgpHdkkTvBzJ46K2JkM4apkg414erD3S+qLvwiYk3DTorANbbkA+54tVJsXrSGsaUjGifR31OaRK98aDVgICvl60Nymo3+I6527+BOkZalZsbCPzsJ7nALyTNu9Ud2FsvfK0WpAQVOf4teoHT4R/7E7ENChmgHRvI/TWumKfWcyr//Q7b9bLipFivk0EDzkpApdaEsClxE7JjT33aZhMvtuvLn5mQF3L5/ubGs5ZZy+nk4AyhR1DBTYjBYzKoamf94JW3BPobg5heH8gGnNoA+5l3WOJA7uvzw==
JWT_EXPIRATION=192h # 3 days
# FONT_END_URL
FRONT_END_URL=
#GOOGLE
GOOGLE_CLIENT_ID=
GOOGLE_APPLICATION_CREDENTIALS=google-service.json
#STRIPE
STRIPE_SECRET_KEY=
STRIPE_WEBHOOK_SECRET=
#TRIAL PERIOD IF EXIST
TRIAL_DAYS=
```
### Angular Environnement
Edit src/environments/environnement.ts
export const environment = {
// GOOGLE AUTH
google_client_id:
// GOOGLE TAG for ANALYTICS
google_tag_id:
}
## Create Tables
To set up the required tables, navigate to the downloaded Nest.js project repostiory and run the following command:
```sh
npx ts-node ./node_modules/.bin/typeorm migration:run -d ./datasource.ts
```
## Run
### Angular
To start Angular project, simply run:
```sh
ng serve
```
Angular instance is now running at [http://localhost:4200/](http://localhost:3000/).
### Nest.js
To start Nest.js project, simply run:
```sh
npm run start:dev
```
Nest.js instance is now running at .
### Node.js/MongoDB
Run the following command to start the server:
```sh
npm run start
```
Node.js instance is now running at .
Congratulations! Your Nzoni project is now running!
# Angular
Nzoni is built on Angular, Tailwind CSS, and integrates seamlessly with Stripe for payment processing.
### Features 🎉
Authentication 🔐
SEO & SSR🌐
Landing Page 🌟
User Dashboard 🖥️
Blog ✍️
Admin Dashboard 👑
####
# Project Structure
In this chapter, we will go through the structure of the Angular project from Nzoni boilerplate and give you an overview of how modules and components are structured.
It's seamlessly integrated with TailwinCSS, API connection and Stripe.
```
#### src/app/dashboard/components/subscription/subscription.component.ts
```typescript
...
constructor(private subscriptionService: SubscriptionService,
private authService: AuthService) {
}
async onChangeSubscription(id: number) {
const res: { paymentUrl: string, success: boolean } = await this.subscriptionService.onChangeSubscription(id);
if (res && res.paymentUrl) {
window.location.href = res.paymentUrl;
}
}
```
### Check subscriptions management from Admin dashboard [here](/angular/admin-dashboard)
# Blog and articles
### Public Articles views
```
├── node_modules
├── src
│ ├── app
│ │ ├── blog
│ │ │ ├── article # public article view component
│ │ │ │ ├── article.component.html
│ │ │ │ ├── article.component.scss
│ │ │ │ ├── article.component.ts
│ │ │ ├── blog.component.html. # article list component
│ │ │ ├── blog.component.scss
│ │ │ ├── blog.component.ts
│ │ │ ├── blog.module.ts
│ │ │ ├── blog-routing.module.ts
```
### Articles management from Admin dashboard [here](/angular/admin-dashboard)
# User Dashboard
In this chapter, we will go through the structure of the User dashboard module of Nzoni boilerplate and give you an overview of how components are structured.
```
├── node_modules
├── src
│ ├── app
│ │ ├── dashboard
│ │ │ ├── components
│ │ │ │ ├── plans # Plans management
│ │ │ │ ├── sidebar
│ │ │ │ ├── profile # User profil management
│ │ │ │ ├── header
│ │ │ ├── dashboard-routing.module.ts
│ │ │ ├── dashboard.component.html
│ │ │ ├── dashboard.component.scss
│ │ │ ├── dashboard.component.ts
│ │ │ ├── dashboard.module.ts
```
# Admin Dashboard
In this chapter, we will go through the structure of the Admin module of Nzoni boilerplate and give you an overview of how components are structured.
```
├── node_modules
├── src
│ ├── app
│ │ ├── admin
│ │ │ ├── components
│ │ │ │ ├── account # User profil management
│ │ │ │ ├── blog-post # Articles management
│ │ │ │ ├── overview
│ │ │ │ ├── plans # Plans and Subscriptions management
│ │ │ │ ├── users # Users management
│ │ │ ├── admin-routing.module.ts
│ │ │ ├── admin.component.html
│ │ │ ├── admin.component.scss
│ │ │ ├── admin.component.ts
│ │ │ ├── admin.module.ts
```
# SEO & SSR
In this chapter, we will explain the SEO module of Nzoni Boilerplate
### Seo Service
```typescript
export class SeoService {
constructor(private title: Title,
private meta: Meta,
@Inject(DOCUMENT) private dom: Document) { }
setCanonicalUrl(url:string){
const head = this.dom.getElementsByTagName('head')[0];
let element: HTMLLinkElement = this.dom.querySelector(`link[rel='canonical']`) || null
if (element === null) {
element = this.dom.createElement('link') as HTMLLinkElement;
head.appendChild(element);
}
element.setAttribute('rel', 'canonical')
element.setAttribute('href', url)
}
setLang(lang: string) {
const head = this.dom.getElementsByTagName('html')[0];
head.setAttribute('lang', lang)
}
setMetaTitle(title: string) {
this.title.setTitle(title);
}
setMetaDescription(content: string) {
this.meta.updateTag({
name: 'description',
content
});
}
addMetaTag(content: string, name: string) {
this.meta.addTag({
name,
content
});
}
}
```
### How to set meta title, meta description and canonical url?
```typescript
constructor(private seoService: SeoService) {
}
ngOnit() {
// Set up meta title
this.seoService.setMetaTitle('your_title_here');
// Set up meta description
this.seoService.setMetaDescription('your_description_here');
// set up canonical url
this.seoService.setCanonicalUrl('your_url')
}
```
### How build ssr
```
ng build ssr
ng build prerender
```
# Deploy Angular Project
```
cd nz-angular
# Without SSR
ng build --configuration=prod
# With SSR
ng build ssr
```
Copy **dist/nz-angular** content and upload on server via FTP tool
# Nest.js
Welcome to Nzoni Boilerplate! A powerful SaaS (Software as a Service) boilerplate designed to help you ship fast. Built on Nest.js, TypeORM, PostgreSQL, and integrated with Stripe and email sending capabilities, Nzoni provides essential modules for building and launching your web application quickly.
### Features 🎉
#### Authentication 🔐
* **Email/Password**: Allow users to sign up and log in securely using their email and password.
* **Google Auth**: Seamlessly integrate Google authentication for a convenient sign-in experience.
* **Magic Link**: Implement magic links for effortless authentication without the need for passwords.
#### Blogpost ✍️
* Create and manage blog posts to engage your audience and share valuable content.
#### Users 👥
* Manage user accounts and permissions efficiently.
#### File Upload 📁
* Enable users to upload files securely to your application.
#### Subscription 🔄
* Implement subscription-based models to monetize your service.
#### Payments 💳
* Integrate with Stripe for secure payment processing.
# Project Structure
In this chapter, we will go through the structure of the Nest.js project from Nzoni boilerplate and give you an overview of how modules are structured.
├── node_modules
├── mail-templates
│ ├── account-created.pug # When account is created
│ ├── failed-payment.pug # When a subscription renew failed
│ ├── reset-password.pug # When user request lost password
│ ├── success-payment.pug # When a payment is successfully
│ ├── updated-subscription.pug # When user change subscription
### Set up Email environment variables in .env
```
# MAILING
SMTP_HOST=
SMTP_PORT=
SMTP_SECURE=false
SMTP_AUTH=
SMTP_PASSWORD=
SMTP_FROM='"Support name" '
MODERATION_MAIL=
```
### How To send a email?
```typescript
// import user service
import { UsersService } from 'src/domains/users/users.service';
constructor(private readonly usersService: UsersService) {}
// call send email to user
await this.usersService.sendMailToUser(...)
```
# Database and Migration
### All migrations path
### Upload an image
Find out the root below in the controller src/domains/file-uploads/file-uploads.controller.ts
```typescript
@Post('/image')
@ApiOperation({
operationId: 'Upload an image',
description: 'Upload a file containing an image',
})
@UseInterceptors(
FileInterceptor('file', {
fileFilter: (req, file, cb) => {
if (file.size > 1000 * 1000) {
cb(new BadRequestException('Image is too large'), false);
} else if (!file.mimetype.startsWith('image')) {
cb(new BadRequestException('Invalid file format'), false);
} else {
cb(null, true);
}
},
}),
)
async uploadImage(@UploadedFile() file): Promise {
return await this.service.saveFile(file, 'image');
}
```
### Read an image
Find out the root below in the controller src/domains/file-uploads/file-uploads.controller.ts
```typescript
@Get('/:id/image')
@ApiOperation({
operationId: 'Get an image',
})
async getImage(@Res() res, @Param('id') id: number) {
const image = await this.service.repo.findOne({ where: { id, type: 'image' }});
if (!!image && existsSync(image.path)) {
res.set('Content-Type', image.mimetype);
createReadStream(image.path).pipe(res);
} else {
throw new BadRequestException(`File with id ${id} does not exists`);
}
}
```
# Users
In this chapter, we will go through the Users Module and give you an overview of how module works
### Users module path
### User entity
```typescript
@Entity()
export class User extends BaseEntity {
// before insert and update hooks
@BeforeInsert()
@BeforeUpdate()
async hashPassword() {
if (!!this.password) {
if (!this.password.includes('$2b$10')) {
this.password = bcrypt.hashSync(this.password, 10);
}
}
}
@BeforeInsert()
@BeforeUpdate()
lowerCaseEmail() {
this.email = this.email.toLowerCase();
}
@PrimaryGeneratedColumn()
id: number;
@Column({ default: false })
isAdmin: boolean;
@Column({ nullable: true })
firstName: string;
@Column({ nullable: true })
lastName: string;
@Index({ unique: true })
@Column()
email: string;
@Column({ nullable: true })
password: string;
@Column({ default: null })
resetPasswordToken: string;
@Column({ default: false })
confirmPayment: boolean;
@Column({ default: false })
errorPayment: boolean;
@Column({ nullable: true })
customerStripeId: string;
@Column({ nullable: true })
@IsOptional()
endSubscription: Date;
@Column({ default: false })
canceledSubscription: boolean;
@Column({ nullable: true})
magicToken: string;
@Column({ nullable: true })
planId: number;
@ManyToOne(() => Plan, plan => plan.users)
@JoinColumn()
plan: Plan;
@CreateDateColumn()
createdAt: Date;
@UpdateDateColumn()
updatedAt: Date;
}
export function password(length): string {
let pass = '';
for (let l=0; l < length; l++) {
const rand = Math.random() * (126 - 33) + 33;
pass += String.fromCharCode(~~rand);
}
return pass;
}
```
### Users routes
```typescript
@Controller('users')
export class UsersController implements CrudController {
private readonly logger = new Logger(UsersController.name);
constructor(
public service: UsersService,
private readonly shared: SharedService,
private readonly authService: AuthService,
) {}
@Delete('/:id')
@ApiOperation({
operationId: 'Deactivate user',
description: 'Deactivate an existing user',
})
@UseGuards(AdminGuard)
async softDelete(@Param('id') id) {
await this.service.softDelete(id);
return null;
}
@Get('list')
@UseGuards(AdminGuard)
async getList(@Query('page') page: number, @Query('limit') limit: number, @Query('nameOrEmail') nameOrEmail: string = null) {
return await this.service.getUsers(page, limit, nameOrEmail);
}
@Get('/me')
@ApiOperation({
operationId: 'Get current user',
description: 'Get user information for logged user',
})
@ApiOkResponse({ type: UserResponse })
@UseGuards(ConnectedUserGuard)
async getCurrentUser(
@CurrentUser() userPayload: TokenPayload,
): Promise {
const user = await this.service.findOne({ where: { id: userPayload.id }});
delete user.password;
delete user.resetPasswordToken;
return user;
}
@Get('stats')
@UseGuards(AdminGuard)
async getStats(@Query('from') from: Date, @Query('to') to: Date) {
return await this.service.getStats(from, to);
}
@Put('/me')
@ApiOperation({
operationId: 'Update current user',
description: 'Update user information for logged user',
})
@ApiOkResponse({ type: UserResponse })
@UseGuards(ConnectedUserGuard)
async updateCurrentUser(
@Body() updatedUserInfo: UserUpdateRequest,
@CurrentUser() userPayload: TokenPayload
) {
const user = await this.service.findOne({ where: {id: userPayload.id }});
let paymentUrl = null;
if (typeof updatedUserInfo.canceledSubscription !== 'undefined') {
if (updatedUserInfo.canceledSubscription) {
// cancel subscription
await this.shared.cancelSubscription(user.customerStripeId);
} else {
// reactivate subscription
paymentUrl = await this.shared.getSubscriptionUrl(user, false, user.subscriptionId);
updatedUserInfo.canceledSubscription = true;
}
}
const resp = await this.service.repo.update({id: userPayload.id}, updatedUserInfo);
// changer de plan
if (!!updatedUserInfo.subscriptionId) {
const subscription: Subscription = await this.service.repoSubscription.findOne({where: {id: updatedUserInfo.subscriptionId}});
const subscriptions = await this.shared.getSubscriptions(user.customerStripeId);
await this.shared.updateSubscription(subscriptions[subscriptions.length - 1].id, subscription.stripePlanId);
}
if (!resp) {
throw new Error('Error updating user');
}
if (paymentUrl) {
return {resp, paymentUrl};
} else {
return resp;
}
}
@Put('/password')
@ApiOperation({
operationId: 'Update current user',
description: 'Update user information for logged user',
})
@ApiOkResponse({ type: UserResponse })
@UseGuards(ConnectedUserGuard)
async updateUserPassword(
@Body() updatedUserInfo: UserUpdateRequest,
@CurrentUser() userPayload: TokenPayload
) {
const validate = await this.authService.validateUser(userPayload.email, updatedUserInfo.oldPassword);
if (!validate) {
throw new Error('Incorrect Old Password');
}
return await this.service.repo.update({ id: userPayload.id }, { password: updatedUserInfo.password });
}
}
```
# Deploy Nest.js project
```
nest build
```
Deploy folder content dist/
# Node.js/MongoDB
## **Get Started**
Let's get your SaaS application up and running quickly :
1. **Clone the Project:** Use your GitHub access token to clone the project:
```
git clone https://@github.com/nzoni-app/nz-nodejs-mongodb.git
```
2. **Environment Variables:** Create a `.env` file based on the `.env.example` and fill in the following details:
`DEFAULT_PLAN_ID`: ID of the default plan assigned to new users is necessary
```markdown
ENV=developpement # OR production OR stagging
PORT=3000
# DB configuration
DB_HOST=localhost
DB_PORT=
DB_USERNAME=
DB_PASSWORD=
DB_NAME=
DB_LOCAL=false
# MAILING
SMTP_HOST=
SMTP_PORT=
SMTP_SECURE=false
SMTP_AUTH=
SMTP_PASSWORD=
SMTP_FROM='"Support name" '
MODERATION_MAIL=
# Logs
APP_DEBUG=true
JOB_ERROR_LOG_PATH='./'
DEFAULT_LOG_PATH='./logs'
# JWT
JWT_SECRET=A/iQ2KX0auTZZBwsbPEGC8H3a78HiiL23WD4S+QAoEq34LdeJ9aPrgpHdkkTvBzJ46K2JkM4apkg414erD3S+qLvwiYk3DTorANbbkA+54tVJsXrSGsaUjGifR31OaRK98aDVgICvl60Nymo3+I6527+BOkZalZsbCPzsJ7nALyTNu9Ud2FsvfK0WpAQVOf4teoHT4R/7E7ENChmgHRvI/TWumKfWcyr//Q7b9bLipFivk0EDzkpApdaEsClxE7JjT33aZhMvtuvLn5mQF3L5/ubGs5ZZy+nk4AyhR1DBTYjBYzKoamf94JW3BPobg5heH8gGnNoA+5l3WOJA7uvzw==
JWT_EXPIRATION=192h # 3 days
# FONT_END_URL
FRONT_END_URL=
#GOOGLE
GOOGLE_CLIENT_ID=
GOOGLE_APPLICATION_CREDENTIALS=google-service.json
#STRIPE
STRIPE_SECRET_KEY=
STRIPE_WEBHOOK_SECRET=
#TRIAL PERIOD IF EXIST
TRIAL_DAYS=
DEFAULT_PLAN_ID=
```
* `DATABASE INFOS`: Connection details for your MongoDB database
3. **Install Dependencies:** Navigate to the project directory and install dependencies:
```sh
cd nz-nodejs-mongodb
npm install
```
4. **Start the Application:** Run the following command to start the server:
```sh
npm run start
```
This will start the application, and you should be able to access it on the port specified in your configuration (usually [http://localhost:3000](http://localhost:3000/)).
# Project structure
This boilerplate is well-organized to keep your code maintainable. Here's a breakdown of the key directories:
```
├── config
│ ├── db_connection.js
├── controllers
│ ├── auth.controller.js
│ ├── blogpost.controller.js
│ ├── file-upload.controller.js
│ ├── payment.controller.js
│ ├── plan.controller.js
│ ├── user.controller.js
├── helpers
│ ├── auth.helper.js
│ ├── file.helper.js
│ ├── index.js
│ ├── mail.helper.js
│ ├── payment.helper.js
│ ├── user.helper.js
├── mail-templates
│ ├── partials
│ ├── account-created.pug
│ ├── canceled-subscription.pug
│ ├── created-subscription.pug
│ ├── default-template.pug
│ ├── failed-payment.pug
│ ├── reset-password.pug
│ ├── success-payment.pug
│ ├── updated-subscription.pug
├── middlewares
│ ├── adminGuard.js
│ ├── connectedUserGuard.js
│ ├── headers.js
│ ├── index.js
├── models
│ ├── Blogpost.js
│ ├── File-upload.js
│ ├── index.js
│ ├── Payment.js
│ ├── Plan.js
│ ├── User.js
├── routes
│ ├── auth.routes.js
│ ├── blogpost.routes.js
│ ├── file-upload.routes.js
│ ├── index.js
│ ├── payment.route.js
│ ├── plan.routes.js
│ ├── user.routes.js
├── uploads
├── .env.example
├── index.js
├── package.json
```
# API endpoints
Here's an overview of the available API endpoints to manage various aspects of your SaaS application:
**Auth Routes** (Authentication)
* `POST /auth/signIn`: Login with email/password
* `POST /auth/signup`: Create a new user account 🆕
* `POST /auth/exist`: Check if an email address already exists
* `PUT /auth/password`: Update user's password
* `POST /auth/password-reset`: Send password reset link
* `POST /auth/google`: Authenticate with Google
* `GET /auth/magic-link`: Send a magic link for login via email 🪄
* `GET /auth/callback/magic-link`: Verify a magic link
**Blog Post Routes** (Blog management)
* `GET /blogposts/`: Get all blog posts
* `GET /blogposts/:id`: Get a specific blog post
* `GET /blogposts/:slug/slug`: Get a blog post by slug
* `GET /blogposts/:slug/latests`: Get latest blog posts (ignoring slug) 🆕
* `POST /blogposts/`: Create a new blog post
* `PUT /blogposts/:id`: Update a blog post ✏️
* `DELETE /blogposts/:id`: Delete a blog post ️
**File Uploads Routes** (Image uploads)
* `POST /file-uploads/image`: Upload an image ️
* `GET /file-uploads/:id/image`: Get an uploaded image ️
**Payment Routes** (STRIPE integration)
* `POST /payments/webhook`: Handle Stripe webhooks (for automatic subscription management)
**Plan Routes** (Subscription plans)
* `GET /plans/all`: Get all available subscription or payment plans
* `GET /plans/:id`: Get a specific plan
* `POST /plans/change`: Update a user's subscription or payment plan
* `POST /plans/`: Create a new subscription or payment plan ➕
* `PUT /plans/:id`: Update a subscription or payment plan ✏️
* `DELETE /plans/:id`: delete a subscription or payment plan
# Angular / Firebase / Node.js
This guide will walk you through the setup, configuration, and usage of Angular / Firebase / Node.js, a robust SaaS boilerplate designed to accelerate your SAAS
## Download repositories
Once you've purchased Nzoni, your github email account will be added to the related projects.\
Make sure you're already connected to github on your cli terminal or use Github Personal access token.
### Download Angular repository
```
git clone https://github.com/nzoni-app/nz-angular-firebase.git
```
### Download Node.js repository
```
git clone https://github.com/nzoni-app/nz-nodejs-firebase.git
```
## Firebase Configuration
Create a Firebase account if you don't have one already, by visiting firebase.google.com.
* Create a new project
* Download the service key JSON file and place it at the root of your Node.js project with the name `serviceAccountKey.json`.
* Enable Email/Password, Google, and passwordless email authentication.
* Enable Firebase and create two indexes:
* Collection ID: `users`
* `createdAt` = Ascending
* `id` = Ascending
* Collection ID: `plans`
* `active` = Ascending
* `position` = Ascending
* Activate Firebase storage
* Set rules:
```bash
rules_version = '2';
service firebase.storage {
match /b/{bucket}/o {
match /{allPaths=**} {
allow read;
allow write: if request.auth != null;
}
}
}
```
* Set `FIREBASE_PROJECT_ID` in the `.env` file.
## Installation
#### Install Node.js (if you haven't already)
If you haven't installed Node.js yet, you can follow the instructions [here](https://nodejs.org/en/learn/getting-started/how-to-install-nodejs).
#### Install Node Modules for Angular project
Navigate to the downloaded Angular project repostiory:
```
cd nz-angular-firebase
npm install
```
#### Install Node Modules for Node.js project
Navigate to the downloaded Node.js project repostiory:
```
cd nz-nodejs-firebase
npm install
```
## Configure Environment Variables
### Node.js environnement
Node.js supports environment variables out of the box. You can set defaults in .env (for all environments), .env.development (for development), and .env.production (for production).
By default, there is the .env.example file. Rename it to .env modify variables
```sh
ENV=developpement
PORT=3000
# DB configuration
DB_HOST=
DB_PORT=
DB_USERNAME=
DB_PASSWORD=
DB_NAME=
DB_LOCAL=true
# Mailing
SMTP_HOST=
SMTP_PORT=
SMTP_SECURE=false
SMTP_AUTH=
SMTP_PASSWORD=
SMTP_FROM='"Support name" '
# Logs
APP_DEBUG=true
JOB_ERROR_LOG_PATH='./'
DEFAULT_LOG_PATH='./logs'
# FONT_END_URL
FRONT_END_URL=
# Mail for moderation
MODERATION_MAIL=
STRIPE_SECRET_KEY=
STRIPE_WEBHOOK_SECRET=
TRIAL_DAYS=
DEFAULT_PLAN_ID=
FIREBASE_PROJECT_ID=
```
### Angular Environnement
Edit src/environments/environnement.ts
```typescript
export const environment = {
production: false,
api: '', // backend-url
domain: '', // frontend-url
google_tag_id: '', // for google analytics
firebase: {
apiKey: "",
authDomain: "",
projectId: "",
storageBucket: "",
messagingSenderId: "",
appId: "",
measurementId: ""
}
}
```
## Run
### Angular
To start Angular project, simply run:
```sh
ng serve
```
Angular instance is now running at [http://localhost:4200/](http://localhost:3000/).
### Node.js
Run the following command to start the server:
```sh
npm run start
```
Node.js instance is now running at .
Congratulations! Your Nzoni project is now running!
# Create first and default plan
You'll find all the steps you need to create a default plan. Note that you will be able to create other plans directly from your admin dashboard.
By default, a plan is created, but you can modify it and/or create your own plans.
## Create a stripe product
To create the first plan, you must first create a product (one-time payment or subscription) from [stripe dashboard](https://dashboard.stripe.com/) where you will retrieve the **price\_id**
## Insert plan from your DB manager
Use your DB manager to manually insert an item in the Plan table by adding stripe **price\_id** to the **stripePlanId** field.
Your plan can have as type '**monthly**' or '**annually**' or '**onetime**'.
Here's Plan data example:
```json
{
"stripePlanId" : "price_1OnnunIaiqRv3A4CB5n2RoVA",
"label" : "Starter",
"devise" : "$",
"price" : 18,
"type" : "monthly",
"createdAt" : ISODate("2024-02-25T18:45:09.764Z"),
"updatedAt" : ISODate("2024-03-18T16:46:48.769Z"),
"deletedAt" : null,
"popular" : false,
"description" : "Our Starter Website Package is perfect for individuals",
"features" : [
"Professionally designed website ",
"Mobile-responsive layout",
"Basic SEO setup to improve search",
"Contact form integration ",
"Social media integration"
],
"active" : false,
"position" : 1
}
```
## Set the default plan
#### Angular
Get your plan id et define it as the default plan in the ***signup.component.ts*** file.
```typescript
...
export class SignupComponent implements OnInit, OnDestroy {
...
planId = // Plan ID;
...
}
```
#### Backend (it's optionnal)
Set the default plan Id in **.env**
```properties
...
DEFAULT_PLAN_ID=
```
If everything's ok, congratulations on creating your first plan.
# Create an Admin User
Discover how to create your Admin User
#### Defaut Admin User
**Email**:
**Password**: admin1234
#### Create a default plan
First step is to create a default plan as described here [Create first and default plan](/create-first-and-default-plan)
#### Signup as regular user
Go to **/auth/signup** and register as a simple user
#### Edit isAdmin to true
In your DB manager, set the **isAdmin** field to **true** in **User** table of the account you've just registered.
Access to admin dashboard at **/admin** and start managing your app
# Support
For any support needs regarding Nzoni Boilerplate, our team is here to help. Whether you have questions, encounter issues, or simply need guidance, feel free to reach out to us at .\
We're dedicated to ensuring your experience with Nzoni Boilerplate is smooth and productive.
