This repo will serve with tutorial to demonstrate how to build a decentralized application (dApp) that interacts with Filecoin Synapse - a smart-contract based marketplace for storage and other services in the Filecoin ecosystem.
This dApp showcases:
- Connecting to Filecoin networks (Mainnet/Calibration)
- Installing synapse-sdk to your project.
- Depositing funds to Synapse contracts using USDFC token.
- Uploading files to Filecoin through Synapse
- Node.js 18+ and npm
- A web3 wallet (like MetaMask)
- Basic understanding of React and TypeScript
- Get some tFIL tokens on Filecoin Calibration testnet link to faucet
- Get some USDFC tokens on Filecoin Calibration testnet link to faucet
- Clone this repository:
git clone https://github.com/yourusername/fs-upload-app
cd fs-upload-app- Install dependencies:
npm install- Run the development server:
npm run devOpen http://localhost:3000 to view the dApp.
The dApp uses RainbowKit for seamless wallet connection, configured specifically for Filecoin networks:
- Filecoin Mainnet
- Filecoin Calibration (testnet)
Shows how to:
- Get user FIL-USDFC-SynapseStorageUsage balances
- hook used to query user balances link
Demonstrates how to:
- Pay for storage by depositing funds to Synapse contracts using USDFC token
- Handles one time payment for 10GB usage that persists 30days
- Notifies repayment if less than 10days remain for paying synapse based on current usage
- hook used to conduct a payment link
Shows how to:
- Create a user-friendly file upload interface
- Upload file to Filecoin using synapse-sdk
- Monitor upload status
- Download filecoin from Filecoin using synapse-sdk
- hook used to upload a file link
- Filecoin synapse-sdk
- USDFC Token Documentation
- Wagmi Documentation
- RainbowKit Documentation
- Best practices in React!
Contributions are welcome! Please feel free to submit a Pull Request.
This project is licensed under the MIT License.