Bireylerin blockchain teknolojisini kullanarak kitle fonlaması kampanyaları oluşturmasına olanak sağlayan bir kitle fonlaması uygulaması.
Kitle fonlaması, bireyler ve kuruluşlar için çeşitli projeler, amaçlar ve etkinlikler için fon toplamanın popüler bir yolu haline geldi. Bununla birlikte, geleneksel kitle fonlaması platformları genellikle merkezileştirilir ve bu da yüksek ücretlere, yavaş işlem sürelerine ve belirli bölgelere sınırlı erişime yol açabilir. Blockchain teknolojisi, kitle fonlaması için merkezi olmayan ve şeffaf bir platform sağlayarak bu sorunlara bir çözüm sunabilir. Bu yazıda, blockchain teknolojisini ve akıllı sözleşmeleri kullanan bir kitle fonlaması uygulamasını nasıl oluşturduğumuzu tartışacağım.
Kitle fonlaması uygulamamızı oluşturmanın ilk adımı, doğru blockchain platformunu seçmekti. Merkezi olmayan uygulamalar oluşturmak için en popüler blockchain platformlarından biri olan Ethereum’u kullanmaya karar verdim. Ethereum, kitle fonlaması platformumuza güç veren akıllı sözleşmeyi yazmak için kullandığımız Solidity adlı güçlü bir programlama diline sahiptir.
Platformumuza karar verdikten sonra HTML, CSS ve JavaScript kullanarak uygulamamızın ön ucunu oluşturmaya başladık. Bireylerin kolaylıkla kitlesel fonlama kampanyaları oluşturup onlara bağışta bulunabilmelerini sağlayacak, kullanıcı dostu bir arayüz oluşturmak istedik. Ayrıca, uygulamamızın duyarlı olduğundan ve çeşitli cihazlarda erişilebilir olduğundan emin olmak istedik.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Crowdfunding Dapp</title>
<link rel="stylesheet" href="style.css">
<script src="https://cdn.jsdelivr.net/gh/ethereum/web3.js/dist/web3.min.js"></script>
<script src="app.js"></script>
</head>
<body>
<div class="container">
<h1 id="title">Crowdfunding Dapp</h1>
<div id="fundingGoal">Funding goal: <span id="goal"></span> ETH</div>
<div id="progressBarContainer">
<div id="progressBar"></div>
</div>
<div id="progressText"><span id="amountRaised"></span> ETH raised out of <span id="goalAmount"></span> ETH</div>
<form id="contributionForm">
<label for="contributionAmount">Contribute:</label>
<input type="number" step="0.01" min="0" id="contributionAmount">
<button type="button" id="contributeButton">Contribute</button>
</form>
<div id="projectStats">
<div class="stat">Total contributors: <span class="stat-value" id="totalContributors"></span></div>
<div class="stat">Minimum contribution: <span class="stat-value" id="minContribution"></span> ETH</div>
<div class="stat">Deadline: <span class="stat-value" id="deadline"></span></div>
</div>
</div>
</body>
</html>
/* Main container */
.container {
max-width: 800px;
margin: 0 auto;
padding: 50px;
background-color: #f7f7f7;
border-radius: 10px;
}/* Title */
#title {
font-size: 2.5rem;
text-align: center;
margin-bottom: 50px;
color: #333;
}
/* Funding goal and progress bar */
#fundingGoal {
font-size: 1.5rem;
margin-bottom: 10px;
}
#progressBarContainer {
height: 20px;
background-color: #ddd;
border-radius: 10px;
margin-bottom: 30px;
}
#progressBar {
height: 100%;
background-color: #4caf50;
border-radius: 10px;
}
#progressText {
font-size: 1.2rem;
text-align: right;
margin-bottom: 10px;
}
/* Contribution form */
#contributionForm {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 50px;
}
#contributionAmount {
font-size: 1.2rem;
padding: 10px;
margin-bottom: 20px;
border-radius: 5px;
border: 1px solid #ccc;
width: 200px;
}
#contributeButton {
font-size: 1.2rem;
padding: 10px 20px;
border-radius: 5px;
border: none;
background-color: #4caf50;
color: #fff;
cursor: pointer;
transition: background-color 0.3s ease;
}
#contributeButton:hover {
background-color: #3e8e41;
}
/* Project stats */
#projectStats {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 30px;
}
.stat {
font-size: 1.2rem;
color: #777;
}
.stat-value {
font-weight: bold;
color: #333;
}
// Import the smart contract ABI and address
const contractABI = ...;
const contractAddress = ...;// Initialize web3
let web3;
if (typeof window.ethereum !== 'undefined') {
web3 = new Web3(window.ethereum);
window.ethereum.enable().catch(error => {
console.error('User denied account access');
});
} else if (typeof window.web3 !== 'undefined') {
web3 = new Web3(window.web3.currentProvider);
} else {
console.error('No web3 provider detected');
}
// Load the smart contract
const crowdfundingContract = new web3.eth.Contract(contractABI, contractAddress);
// Get the project details and display them on the page
crowdfundingContract.methods.getProjectDetails().call().then((result) => {
const title = result(0);
const fundingGoal = web3.utils.fromWei(result(1), 'ether');
const currentFunding = web3.utils.fromWei(result(2), 'ether');
const numContributors = result(3);
document.getElementById('title').textContent = title;
document.getElementById('fundingGoal').textContent = `${fundingGoal} ETH`;
document.getElementById('currentFunding').textContent = `${currentFunding} ETH`;
document.getElementById('numContributors').textContent = numContributors;
});
// Handle the contribution button click event
const contributeButton = document.getElementById('contributeButton');
contributeButton.addEventListener('click', () => {
const contributionAmount = document.getElementById('contributionAmount').value;
if (!contributionAmount) {
alert('Please enter a contribution amount');
return;
}
const weiAmount = web3.utils.toWei(contributionAmount, 'ether');
crowdfundingContract.methods.contribute().send({
from: web3.eth.defaultAccount,
value: weiAmount
}).then(() => {
location.reload();
}).catch((error) => {
alert(error.message);
});
});
Kitle fonlaması platformumuzun temel özelliklerinden biri akıllı sözleşmelerin kullanılmasıdır. Akıllı sözleşmeler, alıcı ve satıcı arasındaki anlaşmanın şartlarının doğrudan kod satırlarına yazıldığı kendi kendini yürüten sözleşmelerdir. Bu uygulamada, kitlesel fonlama kampanyalarını yönetmek için bir akıllı sözleşme kullandım. Akıllı sözleşme, fonların toplanmasını ve dağıtımını yönetir, fonların yalnızca kampanya fonlama hedefine ulaştığında serbest bırakılmasını sağlar ve tüm işlemlerin şeffaf bir kaydını tutar.
Akıllı sözleşmeyi oluşturmak için Solidity’yi kullandık. Solidity, Ethereum platformunda akıllı sözleşmeler yazmak için özel olarak tasarlanmış üst düzey bir programlama dilidir. Akıllı sözleşme kodunu yazdık ve Remix ve Ganache gibi araçları kullanarak Ethereum blok zincirine yerleştirdik.
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;contract Crowdfunding {
// State variables
address public owner;
string public title;
string public description;
uint256 public fundingGoal;
uint256 public deadline;
uint256 public currentFunding;
mapping(address => uint256) public contributions;
address() public contributors;
// Events
event Contribute(address indexed contributor, uint256 amount);
event Withdraw(address indexed contributor, uint256 amount);
event ProjectFunded(uint256 amount);
// Constructor
constructor(string memory _title, string memory _description, uint256 _fundingGoal, uint256 _durationInDays) {
owner = msg.sender;
title = _title;
description = _description;
fundingGoal = _fundingGoal * 1 ether;
deadline = block.timestamp + (_durationInDays * 1 days);
}
// Modifiers
modifier onlyOwner() {
require(msg.sender == owner, "Only the owner can call this function");
_;
}
modifier onlyBeforeDeadline() {
require(block.timestamp < deadline, "The deadline has passed");
_;
}
modifier onlyAfterDeadline() {
require(block.timestamp >= deadline, "The deadline has not passed yet");
_;
}
// Functions
function contribute() public payable onlyBeforeDeadline {
require(msg.value > 0, "Contribution amount must be greater than 0");
if (contributions(msg.sender) == 0) {
contributors.push(msg.sender);
}
contributions(msg.sender) += msg.value;
currentFunding += msg.value;
emit Contribute(msg.sender, msg.value);
}
function withdraw() public onlyAfterDeadline {
require(currentFunding < fundingGoal, "The project is already funded");
uint256 contribution = contributions(msg.sender);
require(contribution > 0, "You have not contributed to the project");
contributions(msg.sender) = 0;
(bool success, ) = payable(msg.sender).call{value: contribution}("");
require(success, "Withdraw failed");
emit Withdraw(msg.sender, contribution);
}
function fundProject() public onlyAfterDeadline {
require(currentFunding >= fundingGoal, "The funding goal has not been reached");
(bool success, ) = payable(owner).call{value: currentFunding}("");
require(success, "Funding failed");
emit ProjectFunded(currentFunding);
}
function getProjectDetails() public view returns (string memory, string memory, uint256, uint256, uint256, uint256) {
return (title, description, fundingGoal, deadline, currentFunding, contributors.length);
}
function getContributorDetails(address _contributor) public view returns (uint256) {
return contributions(_contributor);
}
function getContributors() public view returns (address() memory) {
return contributors;
}
}
Akıllı sözleşmemiz dağıtıldıktan sonra web3.js kullanarak ön ucumuza bağladık. Web3.js, ön uç kodumuzdan Ethereum blok zinciriyle etkileşim kurmamızı sağlayan bir JavaScript kitaplığıdır. web3.js ile, bireylerin kitlesel fonlama kampanyaları oluşturmasına, onlara bağışta bulunmasına ve kampanyalarının ilerlemesini gerçek zamanlı olarak takip etmesine olanak tanıyan kusursuz bir kullanıcı deneyimi oluşturabildik.
Genel olarak, blockchain teknolojisini ve akıllı sözleşmeleri kullanan bir kitle fonlaması uygulaması oluşturmak, ön uç ve arka uç becerilerinin bir kombinasyonunu gerektirir. Ön uç için HTML, CSS ve JavaScript ve akıllı sözleşme için Solidity kullanarak, geleneksel kitle fonlaması platformlarına merkezi olmayan bir alternatif sunan kullanıcı dostu ve şeffaf bir platform oluşturmayı başardık. Blockchain teknolojisinin popülaritesi artmaya devam ettikçe, inşa ettiğimiz gibi merkezi olmayan kitle fonlaması platformlarının önümüzdeki yıllarda giderek daha önemli hale geleceğine inanıyorum.