ipfs-storage-dapp

KO | EN

gitlite — search

#hacktoberfest #react #llm #go #android #deep-learning #linux #nodejs #java #awesome #awesome-list #mcp #ios #openai

ipfs-storage-dapp

(★ 13)

An Ethereum/Polygon Dapp for decentralized storage & web hosting on IPFS

ipfs-storage-dapp 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

## IPFS storage Dapp

![Capture d’écran 2023-05-19 à 01 46 07](https://github.com/kaymen99/ipfs-storage-dapp/assets/83681204/f4f05d87-a70e-4842-a1ac-bda65886cb17)

This is a decentralized application built on the Ethereum/Polygon blockchain, it works like Dropbox or Google Drive by allowing users to securely store their files on the blockchain using IPFS Technology

### Built With

* [Solidity](https://docs.soliditylang.org/)
* [Brownie](https://eth-brownie.readthedocs.io)
* [React.js](https://reactjs.org/)
* [ethers.js](https://docs.ethers.io/v5/)
* [web3modal](https://github.com/Web3Modal/web3modal)
* [material ui](https://mui.com/getting-started/installation/)

<details>
 <summary>Table of Contents</summary>
 <ol>
 <li>
 <a href="#getting-started">Getting Started</a>
 <ul>
 <li><a href="#prerequisites">Prerequisites</a></li>
 <li><a href="#installation">Installation</a></li>
 </ul>
 </li>
 <li>
 <a href="#usage">Usage</a>
 <ul>
 <li><a href="#contracts">Contracts</a></li>
 <li><a href="#scripts">Scripts</a></li>
 <li><a href="#testing">Testing</a></li>
 <li><a href="#front-end">Front End</a></li>
 </ul>
 </li>
 <li><a href="#resources">Resources</a></li>
 <li><a href="#contact">Contact</a></li>
 <li><a href="#license">License</a></li>
 </ol>
</details>

## Getting Started

### Prerequisites

Please install or have installed the following:
* [nodejs and npm](https://nodejs.org/en/download/) 
* [python](https://www.python.org/downloads/)
* [MetaMask](https://chrome.google.com/webstore/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn) Chrome extension installed in your browser

### Installation

1. Installing Brownie: Brownie is a python framework for smart contracts development,testing and deployments. It's quit like [HardHat](https://hardhat.org) but it uses python for writing test and deployements scripts instead of javascript.
 Here is a simple way to install brownie.
 ```
 pip install --user pipx
 pipx ensurepath
 # restart your terminal
 pipx install eth-brownie
 ```
 Or if you can't get pipx to work, via pip (it's recommended to use pipx)
 ```
 pip install eth-brownie
 ```
 Install [ganache-cli](https://www.npmjs.com/package/ganache-cli): 
 ```sh
 npm install -g ganache-cli
 ```
 
3. Clone the repo:
 ```sh
 git clone https://github.com/kaymen99/ipfs-storage-dapp.git
 cd ipfs-storage-dapp
 ```
3. Install Ganache:
 Ganache is a local blockchain that run on your machine, it's used during development stages because it allows quick smart contract testing and avoids all real Testnets problems. 
 You can install ganache from this link : https://trufflesuite.com/ganache/
 
 Next, you need to setup the ganache network with brownie :
 ```sh
 cd ipfs-storage-dapp
 brownie networks add Ethereum ganache-local host=http://127.0.0.1:7545 chainid=5777
 ```
4. Set your environment variables
 To be able to deploy to real Polygon testnets you need to add your PRIVATE_KEY (You can find your PRIVATE_KEY from your ethereum wallet like metamask) to the .env file:
 ```
 PRIVATE_KEY=<PRIVATE_KEY>
 ```
 In this project i used the Polygon Testnet but you can choose to use ethereum testnets like rinkeby, Kovan.
 
 To setup the Polygon Testnet with brownie you'll need an Alchemy account (it's free) and just create a new app on the polygon network
 
 ![Capture d’écran 2022-01-25 à 00 14 44](https://user-images.githubusercontent.com/83681204/150881084-9b60349e-def0-44d2-bbb2-8ca7e27157c7.png)
 
 
 After creating the app copy the URL from -view key- and run this: 
 ```sh
 cd ipfs-storage-dapp
 brownie networks add Polygon polygon-mumbai host=<Copied URL> chainid=80001 name="Mumbai Testnet (Alchemy)"
 ```
 
 You'll also need testnet MATIC. You can get MATIC into your wallet by using the Polygon testnet faucets located [here](https://faucet.polygon.technology). 
 
5. As infura recently removed its free IPFS gateway i used `web3.storage` api for files into IPFS, this api is as simple as infura it requires the creation of a free account and a new api token which you can do [here](https://web3.storage), when you finish add your api token into the `src/utils/StoreContent.js` file:
 ```js
 const web3storage_key = "YOUR-WEB3.STORAGE-API-TOKEN";
 ```

(<a href="#top">back to top</a>)

## Usage

### Contracts

In the ipfs-storage-dapp folder you'll find a directory contracts, all the smart contracts build in brownie are stored there. The FileStorage contract is the core of this application, it plays the role of the backend and has the following features:

<ul>
 <li>SetUploadFee: for every file uploaded the user must pay a small fee set by the owner of the contract</li>
 <li>Upload: allows the user to upload his file </li>
 <li>getUserFiles: a function for getting all the files uploaded by a given user </li>
 <li>Chainlink Price Feed: the contract uses the price feed provided by chainlink oracle for converting the fee set by the owner from $ to MATIC </li> 
 </ul>

(<a href="#top">back to top</a>)
 
### Scripts

In the ipfs-storage-dapp folder you'll find a directory scripts, it contain all the python code for deploying your contracts and also some useful functions

The reset.py file is used to remove all previous contracts deployments from build directory:
 ```sh
 brownie run scripts/reset.py
 ```
 The deploy.py file allow the deployment to the blockchain, we'll use the local ganache for now:
 ```sh
 brownie run scripts/deploy.py --network=ganache-local
 ```
 The update_front_end.py is used to transfer all the smart contracts data (abi,...) and addresses to the front end in the artifacts directory:
 ```sh
 brownie run scripts/update_front_end.py
 ```
 
 After running this 3 cammands, the FileStorage contract is now deployed and is integrated with the front end
 
 (<a href="#top">back to top</a>)
 
 ### Testing

In your ipfs-storage-dapp folder you'll find a directory tests, it contain all the python code used for testing the smart contract functionalities
 
 You can run all the tests by :
 ```sh
 brownie test
 ```
 Or you can test each function individualy:
 ```sh
 brownie test -k <function name>
 ```
 
(<a href="#top">back to top</a>)
 
### Front-end
 
 The user interface of this application is build using React JS, it can be started by running: 
 ```sh
 cd front-end
 yarn
 yarn start
 ```
 It uses the following libraries:
 <ul>
 <li>Ethers.js: for conecting to Metamask and interacting with smart contract</li>
 <li>ipfs-http-client: for connecting and uploading files to IPFS </li>
 <li>@reduxjs/toolkit: for managing the app states (account, balance, blockchain) </li>
 <li>Material UI: used for react components and styles </li> 
 </ul>
 
 The files are structured as follows:
 <ul>
 <li>Components: Contains all the app component(main, navbar, filestorage,...) </li>
 <li>features: contains the redux toolkit reducer and actions </li>
 <li>artifacts: contains all the smart contract data and addresses transfered earlier </li>
 <li>NetworksMap: a json file for some known blockchains names & chain id </li> 
 </ul>
 
(<a href="#top">back to top</a>)

## Resources

To learn about Smart Contract and Brownie:

* [Patrick Collins FreeCodeCamp Complete Course](https://youtu.be/M576WGiDBdQ)
  * ["Getting Started with Brownie"](https://iamdefinitelyahuman.medium.com/getting-started-with-brownie-part-1-9b2181f4cb99) is a good tutorial to help you familiarize yourself with Brownie.

(<a href="#top">back to top</a>)

## Contact

If you have any question or problem running this project just contact me: aymenMir1001@gmail.com

(<a href="#top">back to top</a>)

## License

Distributed under the MIT License. See `LICENSE.txt` for more information.

(<a href="#top">back to top</a>)

ipfs-storage-dapp

ipfs-storage-dapp 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

ipfs-storage-dapp

ipfs-storage-dapp 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README