-
Notifications
You must be signed in to change notification settings - Fork 35
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #520 from bluewave-labs/develop
Develop
- Loading branch information
Showing
96 changed files
with
3,192 additions
and
3,206 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,19 +1,7 @@ | ||
# Development Environment Configuration | ||
NODE_ENV=development | ||
PORT=3000 | ||
# Database Configuration | ||
DEV_DB_USERNAME=user123 | ||
DEV_DB_PASSWORD=password123 | ||
DEV_DB_NAME=onboarding_db | ||
DEV_DB_HOST=localhost | ||
DEV_DB_PORT=5432 | ||
NODE_ENV=production | ||
|
||
# JWT Secret Key | ||
JWT_SECRET="NKrbO2lpCsOpVAlqAPsjZ0tZXzIoKru7gAmYZ7XlHn0=qqwqeq" | ||
|
||
EMAIL=[email protected] | ||
EMAIL_PASSWORD=passwor | ||
EMAIL_HOST=smtp.gmail.com | ||
EMAIL_PORT=465 | ||
APP_PASSWORD=ukzwakckupguegiw | ||
EMAIL_ENABLE=false | ||
# Used in docker-compose.yml db | ||
POSTGRES_USER=user123 | ||
POSTGRES_PASSWORD=password123 | ||
POSTGRES_DB=onboarding_db |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,26 +1,24 @@ | ||
![](https://img.shields.io/github/license/bluewave-labs/bluewave-onboarding) | ||
![](https://img.shields.io/github/repo-size/bluewave-labs/bluewave-onboarding) | ||
![](https://img.shields.io/github/commit-activity/w/bluewave-labs/bluewave-onboarding) | ||
![](https://img.shields.io/github/last-commit/bluewave-labs/bluewave-onboarding) | ||
![](https://img.shields.io/github/languages/top/bluewave-labs/bluewave-onboarding) | ||
![](https://img.shields.io/github/issues-pr/bluewave-labs/bluewave-onboarding) | ||
![](https://img.shields.io/github/issues/bluewave-labs/bluewave-onboarding) | ||
![](https://img.shields.io/github/license/bluewave-labs/guidefox) | ||
![](https://img.shields.io/github/repo-size/bluewave-labs/guidefox) | ||
![](https://img.shields.io/github/commit-activity/w/bluewave-labs/guidefox) | ||
![](https://img.shields.io/github/last-commit/bluewave-labs/guidefox) | ||
![](https://img.shields.io/github/languages/top/bluewave-labs/guidefox) | ||
![](https://img.shields.io/github/issues-pr/bluewave-labs/guidefox) | ||
![](https://img.shields.io/github/issues/bluewave-labs/guidefox) | ||
|
||
# BlueWave Onboarding | ||
# Guidefox | ||
|
||
BlueWave Onboarding helps app owners build knowledge and user-experience oriented apps. It includes the following features: | ||
Guidefox helps app owners build knowledge and user-experience oriented apps. It includes the following features: | ||
|
||
- Welcome tours | ||
- Product hints | ||
- Checklists | ||
- Welcome tours (in progress) | ||
- Popups | ||
- Banners | ||
- Links | ||
- Helper links | ||
- Hints | ||
|
||
This is a work-in-progress application. The source code is available under GNU AGPLv3. | ||
|
||
![Main dashboard](https://github.com/bluewave-labs/bluewave-onboarding/blob/master/Dashboard.png) | ||
The source code is available under GNU AGPLv3. If you would like to support us, please consider giving it a ⭐ and click on "watch" so you can latest news from us. | ||
|
||
![guidefox](https://github.com/user-attachments/assets/46d912c9-339a-4044-979b-338557f28949) | ||
|
||
## Tech stack | ||
|
||
|
@@ -29,8 +27,25 @@ This is a work-in-progress application. The source code is available under GNU A | |
- [Node.js](https://nodejs.org/en) | ||
- [PostgreSQL](https://postgresql.org) | ||
|
||
## For Local Use | ||
|
||
Make sure docker and git is installed | ||
|
||
1. Clone the project | ||
|
||
`git clone https://github.com/bluewave-labs/guidefox.git` | ||
|
||
2. Navigate to the project directory | ||
|
||
`cd guidefox` | ||
|
||
3. Run docker | ||
|
||
`docker compose build` | ||
|
||
`docker compose up` | ||
|
||
## Installation | ||
## Server Installation | ||
|
||
1. Make sure Docker is installed to your machine where the server will run. | ||
2. Make sure git is installed to your machine Git. | ||
|
@@ -40,84 +55,222 @@ This is a work-in-progress application. The source code is available under GNU A | |
|
||
``` | ||
cd ~ | ||
git clone https://github.com/bluewave-labs/bluewave-onboarding.git | ||
git clone https://github.com/bluewave-labs/guidefox.git | ||
cd bluewave-onboarding | ||
``` | ||
|
||
5. Configure Nginx | ||
|
||
Open the Nginx configuration file: | ||
|
||
``sudo nano /etc/nginx/sites-available/onboarding-demo`` | ||
`sudo nano /etc/nginx/sites-available/guidefox` | ||
|
||
Add the following configuration. Change YOUR_DOMAIN_NAME with your domain name: | ||
|
||
```server { | ||
listen 80; | ||
server_name YOUR_DOMAIN_NAME; | ||
return 301 https://$host$request_uri; | ||
} | ||
Add the following configuration. Change YOUR_DOMAIN_NAME with your domain name: | ||
|
||
``` | ||
server { | ||
listen 443 ssl; | ||
listen 80; | ||
server_name YOUR_DOMAIN_NAME; | ||
ssl_certificate /etc/letsencrypt/live/YOUR_DOMAIN_NAME/fullchain.pem; | ||
ssl_certificate_key /etc/letsencrypt/live/YOUR_DOMAIN_NAME/privkey.pem; | ||
include /etc/letsencrypt/options-ssl-nginx.conf; | ||
ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; | ||
location / { | ||
proxy_pass http://localhost:4173; | ||
proxy_pass http://localhost:4173; # Frontend React app | ||
proxy_set_header Host $host; | ||
proxy_set_header X-Real-IP $remote_addr; | ||
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; | ||
proxy_set_header X-Forwarded-Proto $scheme; | ||
} | ||
location /api/ { | ||
proxy_pass http://localhost:3000; | ||
proxy_pass http://localhost:3000; # Backend API | ||
proxy_set_header Host $host; | ||
proxy_set_header X-Real-IP $remote_addr; | ||
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; | ||
proxy_set_header X-Forwarded-Proto $scheme; | ||
} | ||
location /mailhog/ { | ||
proxy_pass http://localhost:8025; # MailHog web interface | ||
proxy_http_version 1.1; | ||
proxy_set_header Upgrade $http_upgrade; | ||
proxy_set_header Connection 'upgrade'; | ||
proxy_set_header Host $host; | ||
proxy_cache_bypass $http_upgrade; | ||
} | ||
} | ||
``` | ||
|
||
|
||
6. Create a symbolic link to enable the configuration: | ||
|
||
``sudo ln -s /etc/nginx/sites-available/onboarding-demo /etc/nginx/sites-enabled/`` | ||
`sudo ln -s /etc/nginx/sites-available/guidefox /etc/nginx/sites-enabled/` | ||
|
||
7. Install Certbot and its Nginx plugin: | ||
|
||
``sudo apt install certbot python3-certbot-nginx`` | ||
`sudo apt install certbot python3-certbot-nginx` | ||
|
||
Make sure you have `/etc/letsencrypt/options-ssl-nginx.conf` If not you can get it from https://raw.githubusercontent.com/certbot/certbot/master/certbot-nginx/certbot_nginx/_internal/tls_configs/options-ssl-nginx.conf | ||
|
||
8. Obtain SSL Certificate. Run Certbot to obtain a certificate for your domain: | ||
|
||
``sudo certbot --nginx`` | ||
`sudo certbot --nginx` | ||
|
||
9. Verify the Nginx configuration: | ||
|
||
``sudo nginx -t`` | ||
`sudo nginx -t` | ||
|
||
10. Restart Nginx to apply the changes: | ||
|
||
``sudo systemctl restart nginx`` | ||
`sudo systemctl restart nginx` | ||
|
||
11. Start the project | ||
|
||
``cd ~/bluewave-onboarding | ||
docker compose up -d`` | ||
`cd ~/guidefox | ||
docker compose up -d` | ||
|
||
## Environment variables | ||
|
||
In order to the project to run safely and correctly, the user should add their own environment variables. They can be added to the .env file in the backend directory of the project. The following is the list of environment variables that should be added and its description: | ||
|
||
1. Node Env | ||
|
||
```env | ||
NODE_ENV - node environment (production, test or development) | ||
``` | ||
|
||
It is set from the .env file in the root directory | ||
|
||
2. Api Url | ||
|
||
``` | ||
API_BASE_URL - Backend API url | ||
``` | ||
|
||
It is set from ./frontend/src/utils/constant.js | ||
|
||
3. Database credentials | ||
|
||
In the root folder | ||
|
||
```env | ||
POSTGRES_USER - Database username (The same as DB_USERNAME) | ||
POSTGRES_PASSWORD -Database password (The same as DB_PASSWORD) | ||
POSTGRES_DB - Database name (The same as DB_NAME) | ||
``` | ||
|
||
In the backend folder | ||
|
||
```env | ||
DB_USERNAME - Database username | ||
DB_PASSWORD - Database password | ||
DB_NAME - Database name | ||
DB_HOST - Database host | ||
DB_PORT - Database port | ||
TEST_DB_USERNAME - Test database username | ||
TEST_DB_PASSWORD - Test database password | ||
TEST_DB_NAME - Test database name | ||
TEST_DB_HOST - Test database host | ||
TEST_DB_PORT - Test database port | ||
``` | ||
|
||
4. Email service configuration | ||
For the email service to run correctly, the user should add their own email credentials | ||
|
||
```env | ||
EMAIL_ENABLE - Enable email service (boolean) | ||
EMAIL_HOST - Email host | ||
EMAIL_PORT - Email port | ||
EMAIL - Email | ||
APP_PASSWORD - Email password | ||
FRONTEND_URL - Url of the frontend server | ||
``` | ||
|
||
Example configuration: | ||
|
||
```env | ||
EMAIL_ENABLE=true | ||
EMAIL_HOST=smtp.gmail.com | ||
EMAIL_PORT=587 | ||
[email protected] | ||
APP_PASSWORD=your-app-specific-password | ||
FRONTEND_URL=https://www.frontendserver.com | ||
``` | ||
|
||
Note: When using Gmail, you'll need to enable 2-factor authentication and generate an App Password. | ||
|
||
5. JWT Secret Key | ||
|
||
```env | ||
JWT_SECRET - secret key to sign the JWT token | ||
``` | ||
|
||
- Use a strong, random secret key (minimum 32 characters) | ||
|
||
6. Enable IP check for the API | ||
If the ENABLE_IP_CHECK is set to true, but the ALLOWED_IP_RANGE and ALLOWED_IPS are not set, the API will work for all IP addresses. | ||
|
||
```env | ||
ENABLE_IP_CHECK - Enable IP check for the API (boolean) | ||
ALLOWED_IP_RANGE - Allowed IP range for the API with the format "baseIp/rangeStart-rangeEnd" (e.g. 192.168.1/1-255) separated by comma | ||
ALLOWED_IPS - Allowed IP addresses for the API separated by comma | ||
``` | ||
|
||
Example configuration: | ||
|
||
```env | ||
ENABLE_IP_CHECK=true | ||
ALLOWED_IP_RANGE=192.168.1/1-255,10.0.0/1-100 | ||
ALLOWED_IPS=203.0.113.1,203.0.113.2 | ||
``` | ||
|
||
Note: For security reasons, it's recommended to always set either ALLOWED_IP_RANGE or ALLOWED_IPS when ENABLE_IP_CHECK is true. | ||
|
||
7. In .env.test file, the user should have the following environment variables, so the postgres container can run correctly: | ||
|
||
```env | ||
POSTGRES_USER - Test database username (The same as TEST_DB_USERNAME) | ||
POSTGRES_PASSWORD - Test database password (The same as TEST_DB_PASSWORD) | ||
POSTGRES_DB - Test database name (The same as TEST_DB_NAME) | ||
``` | ||
|
||
For running tests in windows installing `win-node-env` module is recommended | ||
|
||
## Showing guides on the screen | ||
|
||
After setting up the project, copy and paste the script that can be found in the Code tab of the Settings. Modify Api Base URL to point out to the url of tour backend server. The code snippet can also be found here: | ||
|
||
` | ||
window.bwApiBaseUrl = 'https://guidefox-demo.bluewavelabs.ca/api/'; | ||
window.bwAgentBaseUrl = 'https://cdn.jsdelivr.net/gh/bluewave-labs/[email protected]/jsAgent/'; | ||
|
||
var s=document.createElement("script"); | ||
s.type="text/javascript"; | ||
s.async=false; | ||
s.onerror=()=>{console.log("onboard not loaded");}; | ||
s.src = window.bwAgentBaseUrl + '/main.js'; | ||
(document.getElementsByTagName("head")[0] || document.getElementsByTagName("body")[0]).appendChild(s); | ||
` | ||
|
||
We are working on a browser extention to move this code there to improve the user experience. | ||
|
||
## Contributing | ||
|
||
Here's how you can contribute to the Onboarding product. | ||
We pride ourselves on building strong connections with contributors at every level. Don’t hold back — jump in, contribute and learn with us! | ||
|
||
- Check [Contributor's guideline](https://github.com/bluewave-labs/bluewave-onboarding/blob/master/CONTRIBUTING.md) | ||
- Star this repo :) | ||
- Check [Contributor's guideline](https://github.com/bluewave-labs/guidefox/blob/master/CONTRIBUTING.md) | ||
- Have a look at our Figma designs [here](https://www.figma.com/design/MLPbP1HM2L9ON6f88pHTee/Onboarding?node-id=0-1&t=iwgz015l5QWbWRqU-1). We encourage you to copy to your own Figma page, then work on it as it is read-only. | ||
- Open an issue if you believe you've encountered a bug | ||
- Make a pull request to add new features/make quality-of-life improvements/fix bugs. | ||
- Make sure your send your PRs to **develop** branch. | ||
|
||
<a href="https://github.com/bluewave-labs/guidefox/graphs/contributors"> | ||
<img src="https://contrib.rocks/image?repo=bluewave-labs/guidefox" /> | ||
</a> | ||
|
||
|
||
Also check other developer and contributor-friendly projects of BlueWave: | ||
|
||
- [Checkmate](https://github.com/bluewave-labs/checkmate), a server and infrastructure monitoring tool | ||
- [DataRoom](https://github.com/bluewave-labs/bluewave-dataroom), an secure file sharing application, aka dataroom. | ||
- [BlueWave HRM](https://github.com/bluewave-labs/bluewave-hrm), a complete Human Resource Management platform. | ||
- [VerifyWise](https://github.com/bluewave-labs/verifywise), the first open source AI governance platform. | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,23 +1,10 @@ | ||
# Node environment | ||
NODE_ENV=development | ||
|
||
# Development environment | ||
DEV_DB_USERNAME=user123 | ||
DEV_DB_PASSWORD=password123 | ||
DEV_DB_NAME=onboarding_db | ||
DEV_DB_HOST=db | ||
DEV_DB_PORT=5432 | ||
|
||
EMAIL_ENABLE=true | ||
|
||
# JWT Secret Key | ||
JWT_SECRET="NKrbO2lpCsOpVAlqAPsjZ0tZXzIoKru7gAmYZ7XlHn0=qqwqeq" | ||
|
||
TEST_DB_USERNAME=user123 | ||
TEST_DB_PASSWORD=password123 | ||
TEST_DB_NAME=onboarding_db_test | ||
TEST_DB_HOST=localhost | ||
TEST_DB_PORT=5432 | ||
# For development environment, the project is ready to run after cloning and installing the dependencies. | ||
# Development database environment | ||
DB_USERNAME=user123 | ||
DB_PASSWORD=password123 | ||
DB_NAME=onboarding_db | ||
DB_HOST=db | ||
DB_PORT=5432 | ||
|
||
EMAIL=[email protected] | ||
EMAIL_PASSWORD=passwor | ||
|
@@ -26,11 +13,15 @@ EMAIL_PORT=465 | |
APP_PASSWORD=ukzwakckupguegiw | ||
EMAIL_ENABLE=true | ||
|
||
# Enable IP check for the API | ||
ENABLE_IP_CHECK=false | ||
# Allowed IP range for the API "baseIp/rangeStart-rangeEnd" (e.g. 192.168.1/1-255) separated by comma | ||
ALLOWED_IP_RANGE=11.22.33/10-200, 192.168.65/1-255 | ||
# Allowed IP addresses for the API separated by comma | ||
ALLOWED_IPS=127.0.0.1, 11.22.33.44, 11.22.33.45, 11.22.33.46, 192.168.65.1 | ||
|
||
# FRONTEND_URL=https://onboarding-demo.bluewavelabs.ca/ | ||
FRONTEND_URL=http://localhost:4173/ | ||
FRONTEND_URL=http://localhost:4173/ | ||
|
||
# JWT secret for running npm run dev in backend folder locally | ||
JWT_SECRET="NKrbO2lpCsOpVAlqAPsjZ0tZXzIoKru7gAmYZ7XlHn0=qqwqeq" |
Oops, something went wrong.