آموزش ساخت DAPP اتریوم با مانیتورینگ یکپارچه Web3

ساخت برنامه‌ غیرمتمرکز اتریوم

برنامه‌ های غیرمتمرکز یا DApps برنامه‌ هایی هستند که به پشتیبان متمرکزی که در AWS یا Azure اجرا می‌ شود، یا برنامه‌ های کاربردی تحت وب و برنامه های سنتی مرکزی در موبایل (خارج از میزبانی کد  frontend)، متکی نیستند. در مقابل، این دسته از برنامه های غیرمتمرکز به صورت مستقیم با یک زنجیره بلوکی تعامل دارند که می‌ توان آن را همچون خوشه ای توزیع‌ شده از گره‌ ها، مشابه برنامه‌ هایی تصور کرد که مستقیماً با یک خوشه «بدون مقام مرکزی» در ارتباط هستند. این در حالی است که از گره‌ های Cassandra با تکثیر کامل روی هر همتا در یک شبکه همتا به همتای trustless تعامل دارند.

این گره‌ ها در فناوری بلاکچین به رهبری مرکزی نیاز ندارند؛ زیرا هدف اصلی آن ها دستیابی به یک سیستم غیرمتمرکز است. برخلاف انتخاب رهبر در پروتکل‌ های اجماع مختلف مانند Raft و Paxos، تراکنش‌ های بلاکچین از طریق فرایند های اجماع مانند Proof of Work یا Proof of Stake به گره‌ های «تصادفی» ارسال و پردازش می‌ شوند. این گره ها گره های trustless هستند که در یک شبکه با اندازه دلخواه بر روی دستگاه های محاسباتی مختلف در سراسر جهان اجرا می شوند. چنین فناوری می تواند دفاترکل غیرمتمرکز واقعی و سیستم های سوابق را فعال کند.

برنامه‌ های غیرمتمرکز یا DAppها برنامه های frontend هستند که با فناوری بلاکچین از طریق یک API تعامل دارند. برای اتریوم، این API یک لایه JSON-RPC به نام Ethereum Web3 API است که Moesif به صورت بومی از آن پشتیبانی می کند.

اتریوم چیست؟

اتریوم یک پیاده سازی از فناوری بلاکچین است که می تواند قراردادهای هوشمند را اجرا کند. ماشین مجازی اتریوم تورینگ کامل شده است و می تواند محاسبات دلخواه را مستقیماً در شبکه بلاکچین اجرا کند. در حالی که بیتکوین دارای مجموعه ای محدود از دستورات است، یک قرارداد اتریوم به توسعه دهنده برنامه اجازه می دهد تا دقیقاً تراکنش هایی را که مدنظر آن است، در یک قرارداد هوشمند انجام دهد. قراردادهای هوشمند ساده را می توان به عنوان یک ماشین حالت محدود (FSM) با مجموعه ای از انتقال های سفارشی در نظر گرفت.

قرارداد هوشمند چیست؟

قراردادهای هوشمند می توانند به کاربران بلاکچین امکان مبادله پول و دارایی، یا انجام سایر فعالیت ها را در میان گروهی از کاربران؛ از جمله رأی دادن بدون هیچ گونه مرجع مرکزی را بدهند. برای پلتفرم اتریوم، قراردادهای هوشمند با استفاده از زبانی به نام Solidity تعریف می‌ شوند.

JSON-RPC چیست؟

JSON-RPC یک پروتکل فراخوانی روش راه دور (RPC) سبک وزن و بدون حالت است، که از JSON برای بارگیری استفاده می کند. برخلاف API های RESTful که منبع محور هستند، API های RPC مانند JSON-RPC رویه ای (procedural) هستند و می توانند محکم تر از API های RESTful جفت شوند. برنامه های Frontend با استفاده از JSON-RPC با کلاستر اتریوم ارتباط برقرار می کنند. Web3 API و اتصالات سازگار با اتریوم است که با استفاده از مشخصات JSON-RPC ساخته شده اند. هر برنامه غیرمتمرکز باید از Web3 SDK، مانند Web3.js برای DAppهای مبتنی بر مرورگر استفاده کند.

چگونه قطعات مختلف در کنار هم قرار می گیرند:

اکوسیستم و نحوه تطبیق تمام قطعات فناوری
شکل 1: نموداری از اکوسیستم و نحوه تطبیق تمام قطعات فناوری با یکدیگر نشان داده شده است.

آموزش ساخت برنامه‌ های غیرمتمرکز (DApp)

برای ساخت Dappها می توان از چارچوب Truffle استفاده کرد که مجموعه ای از ابزارها و کدهای boilerplate را برای ایجاد بدنه اصلی (scaffolding ) Dappها در شبکه اتریوم، ارائه می دهد. قبل از شروع کار، اجازه دهید برخی از ملاحظات را مرور کنیم.

  • آیا برنامه‌ غیرمتمرکز رابط کاربری دارد؟ مگر اینکه DApp شما یک فرایند خودکار باشد. DAppها اغلب دارای یک مؤلفه رابط کاربری مانند وب یا برنامه تلفن همراه هستند؛ زیرا اغلب نیازمند به راهی برای تعامل انسان (کاربر) با قراردادهای هوشمند یا شبکه اتریوم هستند. اگر قرار است DApp شما در یک مرورگر اجرا شود، آنگاه رابط کاربری خود را مانند هر برنامه Single Page سنتی در جاوا اسکریپت خواهید ساخت. به عنوان مثال، یکی از محبوب ترین فریمورک های SPA ،React را می توانید در این مورد دنبال کنید.

چارچوب Truffle یک boilerplate به نام جعبه truffle-react را ارائه می‌کند که از تولیدکننده کد برنامه ایجاد واکنش، مشتق شده است.

  • آیا قرارداد هوشمند خود را طراحی کرده اید؟ قراردادهای هوشمند قوانین و انتقالات را برای DApp شما تعریف می کنند. از قرار دادن منطق غیر ضروری در قراردادهای هوشمند خود اجتناب کنید، زیرا gas برای اجرای محاسبات آن می تواند بسیار گران باشد. ما با قرارداد هوشمند ساده ای در ترافل، به نام SimpleStorage، شروع خواهیم کرد. این قرارداد یک عدد صحیح بدون علامت را ذخیره می کند و یک تنظیم کننده و دریافت کننده ارائه می دهد.
pragma solidity ^0.4.18;

contract SimpleStorage {
  uint storedData;

  function set(uint x) public {
    storedData = x;
  }

  function get() public view returns (uint) {
    return storedData;
  }
}
  • در مورد محیط تست چطور؟ از آنجاییکه هر تراکنش نوشتن در قرارداد اتریوم هزینه gas را خواهد داشت، برای جلوگیری از این امر به یک شبکه آزمایشی نیاز دارید. در حالی که اتریوم شبکه‌ های آزمایشی رسمی متعددی را ارائه می‌ کند، Truffle Framework (https://trufflesuite.com/) یک محیط آزمایش محلی را فراهم می‌ کند.

راهنمای گام به گام

  1. Truffle Framework را نصب کنید

npm install -g truffle

در اینجا از g- استفاده می کنیم تا بتوانیم از چارچوب ترافل برای پروژه های دیگر استفاده کنیم.

  1. Generate the boilerplate code

truffle unbox react

چارچوب های ترافل، boilerplates boxes را فراخوانی می کنند. React boilerplate مبتنی بر create-react-app از فیسبوک است (https://github.com/facebook/create-react-app).

این دستور باید مجموعه ای از فایل ها و پوشه ها را ایجاد کند، که تعدادی از این پوشه ها بسیار مهم هستند و در ادامه به بررسی آن ها را می پردازیم.

  • پوشه src/ جایی است که کد react در آن ذخیره می شود.
  • پوشه contracts/ جایی است که قراردادهای هوشمند نوشته شده به زبان solidity در آن ذخیره می شوند. به فایل sol که قبلا ذکر کردیم توجه کنید.
  • Migrations/ اسکریپت هایی برای مدیریت استقرار قراردادها در شبکه اتریوم هستند.
  • در public/، فایل html نقطه ورودی است که برنامه react به آن inject می شود.
  1. محیط توسعه خود را فعال کنید

truffle develop

این شروع دو مورد مهم را در بر خواهدداشت: ابتدا، شبیه ساز Ethereum Node آدرس و پورت ورودی http://127.0.0.1:9545، را به همراه 10 حساب آزمایشی ایجاد می کند که هر کدام دارای 100 اتر هستند. دوم اینکه خط فرمان ترافل را شروع می کند.

  1. قراردادها را کامپایل کنید

در خط فرمان توسعه ترافل:

Compile

این قراردادهای مبتنی بر زبان solidity شما را در اقلام JSON، از جمله بایت کد، به نام بایت کد ماشین مجازی اتریوم (=EVM) کامپایل می کند. قراردادهای کامپایل شده را در پوشه build/contracts پیدا خواهید کرد.

  1. قراردادها را مستقر کنید

در خط فرمان توسعه ترافل:

migrate

این دستور قراردادها را در شبکه Ethereum شبیه سازی شده مستقر می کند. (توجه داشته باشید، می‌توانید بعداً با تغییر فایل truffle-config.js در شبکه واقعی اتریوم، قرارداد خود را مستقر کنید.)

اکنون، می‌توانید برخی از ویژگی‌ های تعاملی مانند فایل App.js را به DApp اضافه کنید.

  1. DApp را اجرا کنید

در این مرحله، می توانید DApp را در مرورگر خود اجرا کنید:

npm run start

با این وجود، هنوز تعامل زیادی با اتریوم ندارد. بنابراین در اینجا لازم است تغییراتی را اعمال کنیم.

اول از همه، ما باید با ایجاد یک handle برروی شیء Web3 و تنظیم ارائه دهنده (provider)، به یک شبکه اتریوم متصل شویم.

توجه: اگر می خواهید نحوه اتصال DApp به Web3.js را ببینید، utils/getWeb3.js را بررسی کنید. Web3 ابتدا بررسی می کند که آیا یک شیء Web3 قبلاً در پنجره مرورگر inject شده است یا خیر و از آن استفاده می کند. اما اگر هیچ نمونه ای از Web3، به مرورگر inject نشده باشد، Web3 سعی می کند به آدرس و پورت http://127.0.0.1/9545 به عنوان ارائه دهنده شبکه متصل شود. اگر از مرورگر Mist، یا از افزونه کیف پول Metamask استفاده می کنید، شیء web3 به صورت خودکار به مرورگر شما inject می شود. می توانید افزونه Metamask (یا مرورگر Mist) را در هر شبکه دلخواهی برای اتصال DApp خود پیکربندی کنید.

  1. کد DApp را تغییر دهید

در App.js، در متد چرخه حیات ()componentWillMount مربوط به React مرجعی به شیء web3 دریافت می کنیم و آن را در حالت محلی ذخیره می کنیم. همچنین، ما یک نسخه محلی از قرارداد را instantiate می کنیم.

getWeb3
.then(results => {
  this.setState({
    web3: results.web3
  })

  // Instantiate contract once web3 provided.
  this.instantiateContract()
})
.catch(() => {
  console.log('Error finding web3.')
})

اکنون می توانیم یک فرم کوچک html را اضافه کنیم:

<form className="pure-form pure-form-stacked">
  <fieldset>
    <label htmlFor="storage">Storage Amount</label>
    <input id="storage" type="number" ref={c => { this.storageAmountInput = c }} />
    <button
      className="pure-button"
      onClick={(e) => {
        e.preventDefault();
        this.addToSimpleStorage()
      }}
    >
      Set Storage
    </button>
  </fieldset>
</form>

این فرم به کاربران اجازه می دهد مقداری که می خواهند در قرارداد SimpleStorage ذخیره کنند را، تعیین نمایند. action handler نیز، در ادامه برای شما آورده شده است:

addToSimpleStorage() {
  if (this.state.simpleStorageInstance && this.state.accounts) {
    const value = this.storageAmountInput.value;
    this.state.simpleStorageInstance.set(value, {from: this.state.accounts[0]})
      .then((result) => {
        return this.state.simpleStorageInstance.get.call(this.state.accounts[0])
      }).then((result) => {
        this.setState(prevState => ({
          ...prevState,
          storageValue: result.c[0]
        }));
      }).catch((err) => {
        console.log('error');
        console.log(err);
      });
  } else {
    this.setState(prevState => ({
      ...prevState,
      error: new Error('simple storage instance not loaded')
    }))
  }
}

در handler، قرارداد نمونه‌ سازی شده برای SimpleStorage و حساب‌ ها را از ایالت محلی دریافت می‌ کنیم. سپس، با استفاده از مقداری که از فرم html به دست می آوریم، storageValue را تنظیم می کنیم.

  1. DApp را اجرا کنید

npm run start

شما باید بتوانید یک StorageValue قرارداد هوشمند را تنظیم کنید که به نوبه خود در بلاکچین اتریوم ذخیره می شود.

نظارت بر API Ethereum Web3 را تنظیم کنید:

از آنجایی که DApp هیچ سرور متمرکزی ندارد، هنگامی که برنامه‌ غیرمتمرکز خود را مستقر می کنید، هیچ سروری برای نصب ابزارهای نظارتی مانند Datadog یا New Relic وجود نخواهد داشت. به منظور نظارت بر تعاملات با قرارداد هوشمند و شبکه اتریوم، ما می خواهیم یک راه حل نظارتی پیشنهاد بدهیم که بتواند از DAppها پشتیبانی کند. پیشنهاد ما Moesif است، که از Ethereum Web3 به عنوان یک API سازگار برای نظارت و تجزیه و تحلیل پشتیبانی می کند.

Moesif می‌ تواند داده‌ های API را مستقیماً از سمت کلاینت با یک مرورگر SDK ثبت کند که به نوبه خود می‌ تواند برای اشکال‌ زدایی و نظارت بر مسائل مرتبط با سرور استفاده شود و شما را از ناهنجاری‌ ها آگاه کند. ما از moesif-browser-js (https://www.moesif.com/docs/client-integration/browser-js/) برای ادغام موجود در GitHub (https://github.com/moesif/moesif-browser-js) استفاده خواهیم کرد.

  1. یک حساب Moesif (https://www.moesif.com/) برای دریافت شناسه برنامه ایجاد کنید.
  2. قطعه کد زیر را به فایل public/index.html اضافه کنید:
script src="//unpkg.com/moesif-browser-js@1.2.0/moesif.min.js"></script>
<script type="text/javascript">
var options = {
  applicationId: 'Your Moesif application id'
  // add other option here.
};

// for options see below.
moesif.init(options);

// this starts the capturing of the data.
moesif.start();
</script>
  1. برنامه خود را دوباره بارگذاری کنید.

Moesif به صورت خودکار فراخوانی های Ethereum Web3 را شناسایی و آن ها را ردیابی می کند. با ورود به Moesif و مشاهده جریان رویداد، تأیید می‌کنید که رویدادها ثبت شده‌اند.

برنامه‌ غیرمتمرکز

محمد امیدی
ارسال دیدگاه

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *