DCL-UI is a Vue.js-based web application for managing the CSA Distributed Compliance Ledger. This app provides a web interface to view and manage data in the Ledger.
The DCL-UI provides features for:
- Viewing and managing compliance records
- Interacting with the distributed ledger
- Managing user access and permissions
- Monitoring ledger status and transactions
- Node.js version 20.x
- Git
- Modern web browser (Chrome, Firefox, Safari, or Edge)
- Basic knowledge of Vue.js and blockchain concepts
Clone the repository:
git clone https://github.com/Comcast/dcl-ui.git
cd dcl-uiInstall dependencies:
npm installStart the development server with hot-reload:
npm run devBuild for production:
npm run builddcl-ui/
├── src/ # Source code
├── public/ # Static assets
├── dist/ # Production build output
├── tests/ # Test files
└── vite.config.js # Vite configuration
The default configuration connects to the CSA Testnet Observer Node. The development environment uses a proxy server for CORS-disabled endpoints.
Environment variables (.env.development):
VITE_APP_DCL_API_NODE=http://localhost:8080/api
VITE_APP_DCL_RPC_NODE=http://localhost:8080/rpc
VITE_APP_DCL_WEBSOCKET_NODE=ws://localhost:8080/websocket
VITE_APP_DCL_CHAIN_ID=testnet-2.0
VITE_APP_DCL_CHAIN_NAME=DCL-Chain-Testnet
VITE_APP_DCL_ADDR_PREFIX=cosmos
VITE_APP_DCL_SDK_VERSION=Stargate
VITE_APP_DCL_TX_API=/rpc/tx?hash=0x
VITE_APP_DCL_REFRESH=500000- Create a
.envfile for production settings (use.env.sampleas reference) - Build the application:
npm run build
- Deploy the contents of the
/distfolder to your web server
Common issues and solutions:
- CORS Issues: Ensure proxy settings are correct in development
- Build Errors: Check Node.js version and dependencies
- API Connection: Verify environment variables and network connectivity
- Fork the repository
- Create a feature branch
- Submit a pull request
For issues and feature requests, please use the GitHub issue tracker.