DigiCard: Digital Visiting Card Builder

Server requirements

What's in the download

digicard-v1.0.0/
├── README.md, LICENSE.txt, CHANGELOG.md
├── docs/
│   ├── documentation/index.html   ← this guide (works offline)
│   ├── installation.md            ← installation steps as text
│   ├── SECURITY.md                ← security features and your checklist
│   └── developer-guide.md         ← how the code is organised and extended
└── src/                           ← upload the contents of this folder
    ├── app.js                     ← startup file
    ├── package.json, .env.example
    ├── server/                    ← Node.js API (Express) and tests
    ├── client/                    ← React source + client/dist (already built)
    └── storage/                   ← database (SQLite), uploads, install flag

The front end is already built in client/dist, so you only need to install the server packages. Do not upload a node_modules folder from your computer; the server installs its own.

Installation on cPanel (Setup Node.js App)

1. Create a database. cPanel → MySQL Databases: create a database and a user, then add the user to the database with All privileges. Note the three values.
2. Upload. cPanel → File Manager: create /home/USER/digicard (outside public_html), upload the zip and extract the contents of src/ into it.
3. Create the Node.js app. cPanel → Setup Node.js App → Create Application: Node.js version 20 or newer, mode Production, application root digicard, your domain or subdomain as the application URL, startup file app.js. Click Create.
4. Install packages. Click Run NPM Install and wait until it finishes (1–3 minutes).
5. Permissions. Set storage/ and storage/uploads/ to 755, then click Restart.
6. Run the installer. Open your domain. You are taken to the 3-step installer.

Finally turn on SSL: cPanel → SSL/TLS Status → Run AutoSSL.

Installation on a VPS (Ubuntu + Nginx)

curl -fsSL https://deb.nodesource.com/setup_22.x | sudo -E bash -
sudo apt install -y nodejs mysql-server nginx
sudo npm i -g pm2
sudo mysql -e "CREATE DATABASE digicard CHARACTER SET utf8mb4; CREATE USER 'digicard'@'localhost' IDENTIFIED BY 'CHANGE_ME'; GRANT ALL ON digicard.* TO 'digicard'@'localhost';"

cd /var/www/digicard          # contents of src/
npm install --omit=dev
cp .env.example .env && nano .env   # APP_URL=https://cards.example.com and DB_* values
npm run setup                  # creates APP_KEY, tables and your admin (add -- --demo for sample cards)
pm2 start app.js --name digicard && pm2 save && pm2 startup

Nginx forwards the domain to Node:

server {
    listen 80;
    server_name cards.example.com;
    client_max_body_size 8M;
    location / {
        proxy_pass http://127.0.0.1:3000;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}

Then sudo certbot --nginx -d cards.example.com. Keep TRUST_PROXY=1 (one proxy). With Cloudflare in front as well, use TRUST_PROXY=2.

Running on your own computer

npm install
npm start          # http://localhost:3000 → installer (choose SQLite for the quickest start)
npm test           # server tests

To change the front end, run npm run dev (API on port 3000) and npm run dev:client (React on port 5173) in two terminals. Run npm run build when you are done.

After installing: 5-minute setup

Dashboard

The dashboard shows your cards, total views, enquiries (with the unread count) and contacts saved, plus a 30-day views chart and the actions visitors took: calls, WhatsApp, Save contact, shares and UPI.

My cards

Each user can have several cards (for example one per business or per staff member). From My cards you can edit, share, publish or unpublish, duplicate and delete. The admin decides how many cards each user may create.

Card editor

The left side has a tab for each part of the card. The right side is a live phone preview that updates as you type. Save (or Ctrl/⌘ + S) stores your changes. If you try to leave with unsaved changes, DigiCard asks first.

Design & sections

Choose one of 6 themes (Modern, Classic, Minimal, Dark, Gradient, Elegant) and any accent colour. Turn sections on or off and change their order. You can also hide the Save contact, Share or QR buttons.

Publish & share

On the Publish tab choose the card address, for example yoursite.com/c/your-name; it is checked as you type. Switch Published on and save. Drafts are visible only to you.

When the link is shared on WhatsApp or Facebook, it shows the name, designation and photo as a preview.

What visitors see

• Call, WhatsApp, Email, Directions buttons at the top.
• Save contact downloads a vCard that opens in the phone's Contacts app.
• Services with prices, gallery, business hours and social links.
• Share card, Share on WhatsApp and a QR code button.

UPI & payments

Add a UPI ID on the Payment tab. The card then shows a UPI QR code and a Pay via UPI button that opens GPay, PhonePe, Paytm or BHIM on a phone. Bank details appear with copy buttons.

Enquiries

Visitors can send a message from the card. It appears in Enquiries and, when email is set up, the card owner gets an email too. Spam is reduced with a hidden honeypot field and a limit of 5 messages per 10 minutes per visitor.

Analytics

DigiCard counts a view once per visitor session, and counts taps on Call, WhatsApp, Email, Directions, Save contact, Share, social links and UPI. Totals per day are kept for every card. The dashboard shows all your cards together; the Publish tab shows one card.

Admin & users

The first account (created by the installer) is an Admin. Admins see the Admin menu; normal users only see their own cards and enquiries.

Settings reference

.env file

Updating to a new version

1. Back up the database, the .env file and the storage/ folder.
2. Upload the new files over the old ones. Do not overwrite .env or storage/.
3. cPanel: Setup Node.js App → Run NPM Install → Restart. VPS: npm install --omit=dev && pm2 restart digicard.
4. Database changes are applied automatically when the app starts.

Backups

Back up the database (cPanel → Backup, or mysqldump digicard > backup.sql) and the storage/uploads/ folder regularly. With SQLite, the database is storage/database.sqlite.

Security

Your checklist: use https, run the installer straight after uploading, keep .env private, keep the app outside public_html, set TRUST_PROXY correctly, and back up. Full details: docs/SECURITY.md.

Running a public demo

1. Install normally, then set DEMO_MODE=true in .env and restart.
2. The demo data (2 logins, 4 cards, enquiries and 30 days of statistics) loads at start-up and again every hour.
3. Some hosts put idle apps to sleep, so also add an hourly cron job: cd /home/USER/digicard && /path/to/node server/cli.js demo-reset.

Demo logins: admin@example.com / password and user@example.com / password. The login page shows one-click buttons for both. Password, profile, user and settings changes and outgoing emails are blocked in demo mode.

Customising the code

The front end is React 19 with Redux Toolkit and Redux-Saga, built from reusable parts:

• client/src/lib/createResource.js: one call creates the Redux state and sagas for any list (cards, enquiries, users).
• client/src/components/ui/: buttons, fields, modal, table, chart, image upload and list editor, all with the same props.
• client/src/components/card/: the card renderer (the same one is used in the editor preview and on the public page), themes and sections.
• client/src/components/card/editorConfig.js: the editor tabs and fields are data. Add a field in one line.

The back end is Node.js with Express, with one folder per feature in server/src/modules/. What a card may contain is defined once in server/src/modules/cards/schema.js. After changing client/src, run npm run build and restart. Step-by-step examples: docs/developer-guide.md.

Troubleshooting

FAQ

Can I sell cards to my customers?

Yes, with the Extended licence. Create accounts for your customers (or open sign-ups) and limit cards per user in Settings. Paid subscription plans are not built in to version 1.0.

Can I use my own domain for each card?

Cards live at yoursite.com/c/name. A custom domain per card is not included in 1.0.

Does Save contact work on iPhone and Android?

Yes. It downloads a standard vCard (.vcf), which both open in the Contacts app.

Where are photos stored?

In storage/uploads/ on your own server, as WebP files with random names.

Credits

DigiCard is built on these open-source projects. Their licences are respected and included with the packages.

Changelog

1.0.0 10 November 2026

First release: digital cards with call / WhatsApp / email / directions, Save contact (vCard), services, gallery, business hours, UPI QR and bank details, enquiry form with email alerts, 6 themes, section ordering, live preview, share link / WhatsApp / printable QR, per-card analytics, enquiries inbox with CSV export, multi-user admin panel, web installer and demo mode.

Support & licence

Email gopinathsbc@gmail.com with your purchase code, your site address and a description or screenshot of the problem. Support covers installation help, bug fixes and questions about existing features. Custom changes are quoted separately.

Your rights are set by the licence you bought (Regular or Extended). See LICENSE.txt. In short: one installation per licence, and the code may not be resold or shared.

© 2026 CodeSanthai. DigiCard v1.0.0 documentation.