This project was developed as part of my training at CodeCrypto Academy. The goal is to demonstrate the practical implementation of blockchain concepts and modern web development.
Main Dashboard - Balance Visualization
ETH Transaction Form
- Real-time balance visualization
- ETH transfers between accounts
- Modern and responsive interface
- Local Ethereum node integration
- Automatic unit conversion (Wei, Gwei, ETH)
- Secure transaction handling
- Automatic balance updates
- React 18
- TypeScript 5
- Vite
- TailwindCSS
- Web3.js
- Ethereum (Geth)
- Node.js
- Node.js (v14 or higher)
- Geth (Ethereum client)
- Git
- Clone the repository:
git clone https://github.com/Richygarcia7/ethereum-dashboard.git
cd ethereum-dashboard- Install dependencies:
cd front
npm install- Start the local Ethereum node:
cd nodo
geth --datadir ./data init genesis.json
geth --datadir ./data --networkid 15 --http --http.addr "0.0.0.0" --http.port 5556 --http.api "eth,net,web3" --http.corsdomain "*" --allow-insecure-unlock- Start the application:
cd front
npm run dev- Open your browser at
http://localhost:5173 - Select a source account
- Choose a destination account
- Enter the amount of ETH to send
- Confirm the transaction
ethereum-dashboard/
├── front/ # React Frontend
│ ├── src/
│ │ ├── components/ # React Components
│ │ ├── App.tsx # Main Component
│ │ └── main.tsx # Entry Point
│ └── package.json
├── nodo/ # Ethereum Node Configuration
│ ├── genesis.json # Initial Configuration
│ └── data/ # Node Data
└── README.md
The project includes three pre-configured accounts with an initial balance of 300,000 ETH each:
0x47c5d423684Fd66a33c70B464884D052e9c3eA930x25e604dc2c1347d8a2998675152ac2803acacf230x8c1f450809eb0c5cc1982db461aa9c64eb7c5d0b
Contributions are welcome. Please open an issue first to discuss the changes you would like to make.
This project is licensed under the MIT License - see the LICENSE file for details.
Richard Garcia - @Richygarcia7
Developer in blockchain technologies and modern web development.