Update documentation

This commit is contained in:
2022-03-10 05:51:15 +00:00
parent 87cfa7bc1d
commit 769a460544
69 changed files with 7194 additions and 56 deletions

View File

@ -16,7 +16,7 @@
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book

View File

@ -17,7 +17,7 @@
<link rel="alternate" hreflang="pt" href="https://docs.wakuconnect.dev/pt/categories/" title="Categories"> <link rel="alternate" hreflang="pt" href="https://docs.wakuconnect.dev/pt/categories/" title="Categories">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/categories/index.xml" title="Waku Connect Docs" /> <link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/categories/index.xml" title="Waku Connect Docs" />
<!-- <!--
Made with Book Theme Made with Book Theme
@ -193,6 +193,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -21,7 +21,7 @@ Symmetric encryption # Uses SubtleCrypto Web API (browser) or NodeJS&#39; crypt
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -192,6 +192,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -27,7 +27,7 @@ Demonstrates:
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -198,6 +198,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -25,7 +25,7 @@ The format for content topics is as follows:
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -196,6 +196,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -21,7 +21,7 @@ For this guide, we are using a single content topic: /relay-guide/1/chat/proto."
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -192,6 +192,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class=" active">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class=" active">Receive and Send Messages Using Waku Relay</a>

View File

@ -19,7 +19,7 @@ Waku Relay is a gossip protocol. As a user, it means that your peers forward you
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -190,6 +190,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -21,7 +21,7 @@ See Cryptographic Libraries for more details on the cryptographic libraries used
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -192,6 +192,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -25,7 +25,7 @@ Create new keypair # Generate a new keypair to sign your messages:" />
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -196,6 +196,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -19,7 +19,7 @@ The Waku Relay protocol sends messages to connected peers but does not provide a
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -190,6 +190,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -19,7 +19,7 @@ Before starting, you need to choose a Content Topic for your dApp. Check out the
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -190,6 +190,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -21,7 +21,7 @@ Waku Relay is a gossip protocol. As a user, it means that your peers forward you
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -192,6 +192,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -20,14 +20,14 @@ export DEBUG=* Browser # To see the debug logs in your browser&rsquo;s console,
<meta property="og:type" content="article" /> <meta property="og:type" content="article" />
<meta property="og:url" content="https://docs.wakuconnect.dev/docs/guides/09_debug/" /><meta property="article:section" content="docs" /> <meta property="og:url" content="https://docs.wakuconnect.dev/docs/guides/09_debug/" /><meta property="article:section" content="docs" />
<meta property="article:published_time" content="2022-01-31T00:00:00+01:00" /> <meta property="article:published_time" content="2022-01-31T00:00:00+01:00" />
<meta property="article:modified_time" content="2022-01-31T10:56:57+11:00" /> <meta property="article:modified_time" content="2022-02-11T22:11:16+11:00" />
<title>How to Debug your Waku dApp | Waku Connect Docs</title> <title>How to Debug your Waku dApp | Waku Connect Docs</title>
<link rel="manifest" href="/manifest.json"> <link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.1ab911b43534094f35fca7ff8b4e9ec387e474fb768f8cefee49c175a03e45a7.js" integrity="sha256-GrkRtDU0CU81/Kf/i06ew4fkdPt2j4zv7knBdaA&#43;Rac=" crossorigin="anonymous"></script> <script defer src="/en.search.min.0d177fc31f8c8c2725b8432ee3b9a0c2b844f8660d18295053409cfed9db3843.js" integrity="sha256-DRd/wx&#43;MjCcluEMu47mgwrhE&#43;GYNGClQU0Cc/tnbOEM=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -263,6 +263,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/10_angular_relay/" class="">Send and Receive Messages Using Waku Relay With Angular v13</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/07_reactjs_relay/" class="">Receive and Send Messages Using Waku Relay With ReactJS</a> <a href="https://docs.wakuconnect.dev/docs/guides/07_reactjs_relay/" class="">Receive and Send Messages Using Waku Relay With ReactJS</a>
@ -302,6 +315,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/11_nwaku/" class="">Nwaku Service Node</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/" class="">Vote Poll Sdk</a> <a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/" class="">Vote Poll Sdk</a>
@ -689,9 +715,9 @@ https://github.com/alex-shpak/hugo-book
<div class="flex flex-wrap justify-between"> <div class="flex flex-wrap justify-between">
<div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/f2e22d0cd0d84dcb7a009346dccca6f013380a0e" title='Last modified by Franck R | Jan 30, 2022' target="_blank" rel="noopener"> <div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/da15b6b74dab744fb436e9f8c10395c4f857c152" title='Last modified by Franck R | Feb 11, 2022' target="_blank" rel="noopener">
<img src="/svg/calendar.svg" class="book-icon" alt="Calendar" /> <img src="/svg/calendar.svg" class="book-icon" alt="Calendar" />
<span>Jan 30, 2022</span> <span>Feb 11, 2022</span>
</a> </a>
</div> </div>

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,761 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Nwaku Service Node # JS-Waku nodes join the Waku network by connecting to service nodes using secure websocket.
Nwaku (prev. nim-waku) is the reference implementation of the Waku v2 protocol and can be used as a service node.
When using { bootstrap: { default: true } }, the js-waku node connects to a fleet of nwaku nodes operated by Status.
It is also possible to deploy your own nwaku node by following these instructions.">
<meta name="theme-color" content="#FFFFFF">
<meta name="color-scheme" content="light dark"><meta property="og:title" content="Nwaku Service Node" />
<meta property="og:description" content="Nwaku Service Node # JS-Waku nodes join the Waku network by connecting to service nodes using secure websocket.
Nwaku (prev. nim-waku) is the reference implementation of the Waku v2 protocol and can be used as a service node.
When using { bootstrap: { default: true } }, the js-waku node connects to a fleet of nwaku nodes operated by Status.
It is also possible to deploy your own nwaku node by following these instructions." />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://docs.wakuconnect.dev/docs/guides/11_nwaku/" /><meta property="article:section" content="docs" />
<meta property="article:published_time" content="2022-02-17T00:00:00+01:00" />
<meta property="article:modified_time" content="2022-02-21T11:24:40+11:00" />
<title>Nwaku Service Node | Waku Connect Docs</title>
<link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.0d177fc31f8c8c2725b8432ee3b9a0c2b844f8660d18295053409cfed9db3843.js" integrity="sha256-DRd/wx&#43;MjCcluEMu47mgwrhE&#43;GYNGClQU0Cc/tnbOEM=" crossorigin="anonymous"></script>
<!--
Made with Book Theme
https://github.com/alex-shpak/hugo-book
-->
</head>
<body dir="ltr">
<input type="checkbox" class="hidden toggle" id="menu-control" />
<input type="checkbox" class="hidden toggle" id="toc-control" />
<main class="container flex">
<aside class="book-menu">
<div class="book-menu-content">
<nav>
<h2 class="book-brand">
<a class="flex align-center" href="/"><span>Waku Connect Docs</span>
</a>
</h2>
<div class="book-search">
<input type="text" id="book-search-input" placeholder="Search" aria-label="Search" maxlength="64" data-hotkeys="s/" />
<div class="book-search-spinner hidden"></div>
<ul id="book-search-results"></ul>
</div>
<ul class="book-languages">
<li>
<input type="checkbox" id="languages" class="toggle" />
<label for="languages" class="flex justify-between">
<a role="button" class="flex align-center">
<img src="/svg/translate.svg" class="book-icon" alt="Languages" />
English
</a>
</label>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/es/">
Español
</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/pt/">
Português
</a>
</li>
</ul>
</li>
</ul>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/introduction/" class="">Introduction</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/quick_start/" class="">Quick Start</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/use_cases/" class="">Use Cases</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/presentations/" class="">Presentations &amp; Videos</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/" class="">Guides</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/01_choose_content_topic/" class="">How to Choose a Content Topic</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/03_store_retrieve_messages/" class="">Retrieve Messages Using Waku Store</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/04_encrypt_messages_version_1/" class="">Encrypt Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/05_sign_messages_version_1/" class="">Sign Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/06_light_push_send_messages/" class="">Send Messages Using Waku Light Push</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/10_angular_relay/" class="">Send and Receive Messages Using Waku Relay With Angular v13</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/07_reactjs_relay/" class="">Receive and Send Messages Using Waku Relay With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/08_reactjs_store/" class="">Retrieve Messages Using Waku Store With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/09_debug/" class="">How to Debug your Waku dApp</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/11_nwaku/" class=" active">Nwaku Service Node</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/" class="">Vote Poll Sdk</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/" class="">Create a DApp</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/01_create_dapp/" class="">Create the DApp and Install Dependencies</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/02_connect_wallet/" class="">Connect to the Ethereum Wallet</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/03_connect_walle_usedapp/" class="">Connect to the Ethereum Wallet useDapp</a>
</li>
</ul>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/" class="">Poll SDK</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/01_create-a-poll_button/" class="">Create-A-Poll Button</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/02_poll_creation/" class="">Poll Creation Component</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/03_poll_list/" class="">Poll List Component</a>
</li>
</ul>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/vote_sdk/" class="">Vote SDK</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/vote_sdk/01_deploying_smart_contract/" class="">Deploy smart contract</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/vote_sdk/02_voting_creation/" class="">Creating Voting component</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/vote_sdk/03_using_voting/" class="">Use Voting Component</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/examples/" class="">Examples</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/crypto_libraries/" class="">Cryptographic Libraries</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/waku_protocols/" class="">Implemented Waku Protocols</a>
</li>
</ul>
<ul>
<li>
<a href="https://js-waku.wakuconnect.dev/" target="_blank" rel="noopener">
JS-Waku API Doc
</a>
</li>
<li>
<a href="https://vac.dev/" target="_blank" rel="noopener">
Vac Team
</a>
</li>
<li>
<a href="https://rfc.vac.dev/" target="_blank" rel="noopener">
Vac RFCs
</a>
</li>
<li>
<a href="https://status.im/" target="_blank" rel="noopener">
Status.im
</a>
</li>
</ul>
</nav>
<script>(function(){var a=document.querySelector("aside .book-menu-content");addEventListener("beforeunload",function(b){localStorage.setItem("menu.scrollTop",a.scrollTop)}),a.scrollTop=localStorage.getItem("menu.scrollTop")})()</script>
</div>
</aside>
<div class="book-page">
<header class="book-header">
<div class="flex align-center justify-between">
<label for="menu-control">
<img src="/svg/menu.svg" class="book-icon" alt="Menu" />
</label>
<strong>Nwaku Service Node</strong>
<label for="toc-control">
<img src="/svg/toc.svg" class="book-icon" alt="Table of Contents" />
</label>
</div>
<aside class="hidden clearfix">
<nav id="TableOfContents">
<ul>
<li><a href="#nwaku-service-node">Nwaku Service Node</a></li>
</ul>
</nav>
</aside>
</header>
<article class="markdown"><h1 id="nwaku-service-node">
Nwaku Service Node
<a class="anchor" href="#nwaku-service-node">#</a>
</h1>
<p>JS-Waku nodes join the Waku network by connecting to service nodes using secure websocket.</p>
<p><a href="https://github.com/status-im/nim-waku/tree/master/waku/v2">Nwaku (prev. nim-waku)</a>
is the reference implementation of the Waku v2 protocol and can be used as a service node.</p>
<p>When using <a href="https://js-waku.wakuconnect.dev/interfaces/discovery.BootstrapOptions.html#default"><code>{ bootstrap: { default: true } }</code></a>,
the js-waku node connects to a fleet of nwaku nodes operated by Status.</p>
<p>It is also possible to deploy your own nwaku node by following <a href="https://github.com/status-im/nim-waku/tree/master/waku/v2#enabling-websocket">these instructions</a>.
Be sure to setup your nwaku node with a valid SSL certificate or js-waku nodes may fail silently to connect to it.</p>
<blockquote class="book-hint info">
We are making it easier for operators to run their own nodes,
this is effort is tracked with <a href="https://github.com/status-im/nim-waku/issues/828">status-im/nim-waku#828</a>.
</blockquote>
<p>You may wish to connect your nwaku node to the rest of the fleet.
This can be done with the <code>--staticnode</code> or <code>--dns-discovery-url</code>.
For example:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-sh" data-lang="sh"><span style="color:#e6db74">`</span>wakunode2 <span style="color:#ae81ff">\
</span><span style="color:#ae81ff"></span> --dns-discovery<span style="color:#f92672">=</span>true <span style="color:#ae81ff">\
</span><span style="color:#ae81ff"></span> --dns-discovery-url<span style="color:#f92672">=</span>enrtree://ANTL4SLG2COUILKAPE7EF2BYNL2SHSHVCHLRD5J7ZJLN5R3PRJD2Y@prod.waku.nodes.status.im
</code></pre></div><p>You can then use <a href="https://js-waku.wakuconnect.dev/interfaces/discovery.BootstrapOptions.html#peers"><code>bootstrap.peers</code></a>
to pass the multiaddr of your node.</p>
<p>For example (replace the multiaddr with your node&rsquo;s).</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-js" data-lang="js"><span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">Waku</span> } <span style="color:#a6e22e">from</span> <span style="color:#e6db74">&#34;js-waku&#34;</span>;
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">waku</span> <span style="color:#f92672">=</span> <span style="color:#66d9ef">await</span> <span style="color:#a6e22e">Waku</span>.<span style="color:#a6e22e">create</span>({
<span style="color:#a6e22e">bootstrap</span><span style="color:#f92672">:</span> {
<span style="color:#a6e22e">peers</span><span style="color:#f92672">:</span> [
<span style="color:#e6db74">&#34;/dns4/node-01.ac-cn-hongkong-c.wakuv2.test.statusim.net/tcp/443/wss/p2p/16Uiu2HAkvWiyFsgRhuJEb9JfjYxEkoHLgnUQmr1N5mKWnYjxYRVm&#34;</span>,
],
},
});
</code></pre></div></article>
<footer class="book-footer">
<div class="flex flex-wrap justify-between">
<div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/915426b852c6d831f6d86c1c81dcbfab86705d07" title='Last modified by Franck R | Feb 21, 2022' target="_blank" rel="noopener">
<img src="/svg/calendar.svg" class="book-icon" alt="Calendar" />
<span>Feb 21, 2022</span>
</a>
</div>
<div>
<a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/edit/develop/content/docs/guides/11_nwaku.md" target="_blank" rel="noopener">
<img src="/svg/edit.svg" class="book-icon" alt="Edit" />
<span>Edit this page</span>
</a>
</div>
</div>
<script>(function(){function a(c){const a=window.getSelection(),b=document.createRange();b.selectNodeContents(c),a.removeAllRanges(),a.addRange(b)}document.querySelectorAll("pre code").forEach(b=>{b.addEventListener("click",function(c){a(b.parentElement),navigator.clipboard&&navigator.clipboard.writeText(b.parentElement.textContent)})})})()</script>
</footer>
<div class="book-comments">
</div>
<label for="menu-control" class="hidden book-menu-overlay"></label>
</div>
<aside class="book-toc">
<div class="book-toc-content">
<nav id="TableOfContents">
<ul>
<li><a href="#nwaku-service-node">Nwaku Service Node</a></li>
</ul>
</nav>
</div>
</aside>
</main>
</body>
</html>

View File

@ -23,7 +23,7 @@ For this guide, we are using a single content topic: /relay-angular-chat/1/chat/
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -194,6 +194,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -27,7 +27,7 @@ export DEBUG=* Browser # To see the debug logs in your browser&rsquo;s console,
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -198,6 +198,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -0,0 +1,940 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Discovery &amp; Bootstrap Nodes # This guide explains the discovery and bootstrap mechanisms currently available in js-waku, their benefits and caveats and how to use them.
Node discovery is the mechanism that enables a Waku node to find other nodes. Waku is a modular protocol, several discovery mechanisms are and will be included in Waku so that developers can select the best mechanism(s) based for their use case and the user&rsquo;s environment (e.">
<meta name="theme-color" content="#FFFFFF">
<meta name="color-scheme" content="light dark"><meta property="og:title" content="Discovery &amp; Bootstrap Nodes" />
<meta property="og:description" content="Discovery &amp; Bootstrap Nodes # This guide explains the discovery and bootstrap mechanisms currently available in js-waku, their benefits and caveats and how to use them.
Node discovery is the mechanism that enables a Waku node to find other nodes. Waku is a modular protocol, several discovery mechanisms are and will be included in Waku so that developers can select the best mechanism(s) based for their use case and the user&rsquo;s environment (e." />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" /><meta property="article:section" content="docs" />
<meta property="article:published_time" content="2022-02-17T00:00:00+01:00" />
<meta property="article:modified_time" content="2022-03-10T16:49:49+11:00" />
<title>Discovery &amp; Bootstrap Nodes | Waku Connect Docs</title>
<link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!--
Made with Book Theme
https://github.com/alex-shpak/hugo-book
-->
</head>
<body dir="ltr">
<input type="checkbox" class="hidden toggle" id="menu-control" />
<input type="checkbox" class="hidden toggle" id="toc-control" />
<main class="container flex">
<aside class="book-menu">
<div class="book-menu-content">
<nav>
<h2 class="book-brand">
<a class="flex align-center" href="/"><span>Waku Connect Docs</span>
</a>
</h2>
<div class="book-search">
<input type="text" id="book-search-input" placeholder="Search" aria-label="Search" maxlength="64" data-hotkeys="s/" />
<div class="book-search-spinner hidden"></div>
<ul id="book-search-results"></ul>
</div>
<ul class="book-languages">
<li>
<input type="checkbox" id="languages" class="toggle" />
<label for="languages" class="flex justify-between">
<a role="button" class="flex align-center">
<img src="/svg/translate.svg" class="book-icon" alt="Languages" />
English
</a>
</label>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/es/">
Español
</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/pt/">
Português
</a>
</li>
</ul>
</li>
</ul>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/introduction/" class="">Introduction</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/quick_start/" class="">Quick Start</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/use_cases/" class="">Use Cases</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/presentations/" class="">Presentations &amp; Videos</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/" class="">Guides</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/01_choose_content_topic/" class="">How to Choose a Content Topic</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class=" active">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/03_store_retrieve_messages/" class="">Retrieve Messages Using Waku Store</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/04_encrypt_messages_version_1/" class="">Encrypt Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/sign_messages_web3_eip712/" class="">Sign Messages Using a Web3 Wallet (EIP-712)</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/05_sign_messages_version_1/" class="">Sign Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/06_light_push_send_messages/" class="">Send Messages Using Waku Light Push</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/07_reactjs_relay/" class="">Receive and Send Messages Using Waku Relay With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/08_reactjs_store/" class="">Retrieve Messages Using Waku Store With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/angular_relay/" class="">Send and Receive Messages Using Waku Relay With Angular v13</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/nwaku/" class="">Nwaku Service Node</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/debug/" class="">How to Debug your Waku dApp</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/" class="">Vote Poll Sdk</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/" class="">Create a DApp</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/01_create_dapp/" class="">Create the DApp and Install Dependencies</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/02_connect_wallet/" class="">Connect to the Ethereum Wallet</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/03_connect_walle_usedapp/" class="">Connect to the Ethereum Wallet useDapp</a>
</li>
</ul>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/" class="">Poll SDK</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/01_create-a-poll_button/" class="">Create-A-Poll Button</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/02_poll_creation/" class="">Poll Creation Component</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/03_poll_list/" class="">Poll List Component</a>
</li>
</ul>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/vote_sdk/" class="">Vote SDK</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/vote_sdk/01_deploying_smart_contract/" class="">Deploy smart contract</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/vote_sdk/02_voting_creation/" class="">Creating Voting component</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/vote_sdk/03_using_voting/" class="">Use Voting Component</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/examples/" class="">Examples</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/crypto_libraries/" class="">Cryptographic Libraries</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/waku_protocols/" class="">Implemented Waku Protocols</a>
</li>
</ul>
<ul>
<li>
<a href="https://js-waku.wakuconnect.dev/" target="_blank" rel="noopener">
JS-Waku API Doc
</a>
</li>
<li>
<a href="https://vac.dev/" target="_blank" rel="noopener">
Vac Team
</a>
</li>
<li>
<a href="https://rfc.vac.dev/" target="_blank" rel="noopener">
Vac RFCs
</a>
</li>
<li>
<a href="https://status.im/" target="_blank" rel="noopener">
Status.im
</a>
</li>
</ul>
</nav>
<script>(function(){var a=document.querySelector("aside .book-menu-content");addEventListener("beforeunload",function(b){localStorage.setItem("menu.scrollTop",a.scrollTop)}),a.scrollTop=localStorage.getItem("menu.scrollTop")})()</script>
</div>
</aside>
<div class="book-page">
<header class="book-header">
<div class="flex align-center justify-between">
<label for="menu-control">
<img src="/svg/menu.svg" class="book-icon" alt="Menu" />
</label>
<strong>Discovery &amp; Bootstrap Nodes</strong>
<label for="toc-control">
<img src="/svg/toc.svg" class="book-icon" alt="Table of Contents" />
</label>
</div>
<aside class="hidden clearfix">
<nav id="TableOfContents">
<ul>
<li><a href="#discovery--bootstrap-nodes">Discovery &amp; Bootstrap Nodes</a>
<ul>
<li><a href="#default-bootstrap-mechanism">Default Bootstrap Mechanism</a></li>
<li><a href="#predefined-bootstrap-nodes">Predefined Bootstrap Nodes</a>
<ul>
<li><a href="#nwaku-prod-fleet">Nwaku Prod Fleet</a></li>
<li><a href="#nwaku-test-fleet">Nwaku Test Fleet</a></li>
</ul>
</li>
<li><a href="#use-your-own-nodes">Use your own nodes</a></li>
<li><a href="#dns-discovery">DNS Discovery</a></li>
<li><a href="#other-discovery-mechanisms">Other Discovery Mechanisms</a></li>
</ul>
</li>
</ul>
</nav>
</aside>
</header>
<article class="markdown"><h1 id="discovery--bootstrap-nodes">
Discovery &amp; Bootstrap Nodes
<a class="anchor" href="#discovery--bootstrap-nodes">#</a>
</h1>
<p>This guide explains the discovery and bootstrap mechanisms currently available in js-waku,
their benefits and caveats and how to use them.</p>
<p>Node discovery is the mechanism that enables a Waku node to find other nodes.
Waku is a modular protocol, several discovery mechanisms are and will be included in Waku
so that developers can select the best mechanism(s) based for their use case and the user&rsquo;s environment
(e.g. mobile phone, desktop browser, server, etc).</p>
<p>When starting a Waku node,
it needs to connect to other nodes to be able to send, receive and retrieve messages.
Which means there needs to be a discovery mechanism that enable finding other nodes when not connected to any node.
This is called <em>bootstrapping</em>.</p>
<p>Once connected, the node needs to find additional peers to have:</p>
<ul>
<li>Enough peers in the Waku Relay mesh (target is 6),</li>
<li>Enough peers in reserve, in case current peers are overloaded or go offline,</li>
<li>Peers with specific Waku capabilities (e.g. Store, Light Push, Filter).</li>
</ul>
<p>For now, we are focusing in making bootstrap discovery protocols available,
research of other discovery protocols is in progress.</p>
<h2 id="default-bootstrap-mechanism">
Default Bootstrap Mechanism
<a class="anchor" href="#default-bootstrap-mechanism">#</a>
</h2>
<p><strong>The default bootstrap mechanism is <a href="#nwaku-prod-fleet">to connect to the Status' nim-waku prod fleet</a></strong>.</p>
<p>To use:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-ts" data-lang="ts"><span style="color:#66d9ef">const</span> <span style="color:#a6e22e">waku</span> <span style="color:#f92672">=</span> <span style="color:#66d9ef">await</span> <span style="color:#a6e22e">Waku</span>.<span style="color:#a6e22e">create</span>({ <span style="color:#a6e22e">bootstrap</span><span style="color:#f92672">:</span> { <span style="color:#66d9ef">default</span><span style="color:#f92672">:</span> <span style="color:#66d9ef">true</span> } });
</code></pre></div><blockquote class="book-hint info">
<p>When creating a Waku node without passing the <code>bootstrap</code> option,
the node does <strong>not</strong> connect to any remote peer or bootstrap node.</p>
<p>As the current strategy is to connect to nodes operated by Status,
we want to ensure that developers consciously opt-in
while providing a friendly developer experience.</p>
<p>We intend to change this in the future and enable boostrap by default
once we have implemented more decentralized strategies.</p>
</blockquote>
<h2 id="predefined-bootstrap-nodes">
Predefined Bootstrap Nodes
<a class="anchor" href="#predefined-bootstrap-nodes">#</a>
</h2>
<p>Addresses of nodes hosted by Status are predefined in the codebase:</p>
<p><a href="https://github.com/status-im/js-waku/blob/e4024d5c7246535ddab28a4262006915d2db58be/src/lib/discovery/predefined.ts#L48">https://github.com/status-im/js-waku/blob/e4024d5c7246535ddab28a4262006915d2db58be/src/lib/discovery/predefined.ts#L48</a></p>
<p>They can be accessed via the <code>getPredefinedBootstrapNodes</code> function.</p>
<p><strong>Pros:</strong></p>
<ul>
<li>Low latency,</li>
<li>Low resource requirements.</li>
</ul>
<p><strong>Cons:</strong></p>
<ul>
<li>Prone to censorship: node ips can be blocked,</li>
<li>Limited: Static number of nodes,</li>
<li>Poor maintainability: Code needs to be changed to update the list.</li>
</ul>
<h3 id="nwaku-prod-fleet">
Nwaku Prod Fleet
<a class="anchor" href="#nwaku-prod-fleet">#</a>
</h3>
<p>The nwaku prod fleet run the latest <a href="https://github.com/status-im/nim-waku/">nwaku</a> release.
The fleet aims to provide a stable, yet not warranted, service.</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-ts" data-lang="ts"><span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">Waku</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;js-waku&#34;</span>;
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">waku</span> <span style="color:#f92672">=</span> <span style="color:#66d9ef">await</span> <span style="color:#a6e22e">Waku</span>.<span style="color:#a6e22e">create</span>({
<span style="color:#a6e22e">bootstrap</span><span style="color:#f92672">:</span> {
<span style="color:#a6e22e">peers</span>: <span style="color:#66d9ef">getPredefinedBootstrapNodes</span>(),
},
});
</code></pre></div><h3 id="nwaku-test-fleet">
Nwaku Test Fleet
<a class="anchor" href="#nwaku-test-fleet">#</a>
</h3>
<p>The nwaku test fleet run the latest commit from <a href="https://github.com/status-im/nim-waku/">nwaku</a>&rsquo;s master branch.
The fleet is subject to frequent database reset,
hence messages are generally kept in store nodes for a few days at a time.</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-ts" data-lang="ts"><span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">Waku</span>, <span style="color:#a6e22e">discovery</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;js-waku&#34;</span>;
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">waku</span> <span style="color:#f92672">=</span> <span style="color:#66d9ef">await</span> <span style="color:#a6e22e">Waku</span>.<span style="color:#a6e22e">create</span>({
<span style="color:#a6e22e">bootstrap</span><span style="color:#f92672">:</span> {
<span style="color:#a6e22e">peers</span>: <span style="color:#66d9ef">getPredefinedBootstrapNodes</span>(<span style="color:#a6e22e">discovery</span>.<span style="color:#a6e22e">predefined</span>.<span style="color:#a6e22e">Fleet</span>.<span style="color:#a6e22e">Test</span>),
},
});
</code></pre></div><h2 id="use-your-own-nodes">
Use your own nodes
<a class="anchor" href="#use-your-own-nodes">#</a>
</h2>
<p>Developers have the choice to run their own <a href="https://github.com/status-im/nim-waku/">nwaku</a> nodes
and use them to bootstrap js-waku nodes.</p>
<p>There are two ways to set bootstrap nodes:</p>
<ol>
<li>Using an array of multiaddrs (as <code>string</code> or <code>Multiaddr</code>):</li>
</ol>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-ts" data-lang="ts"><span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">Waku</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;js-waku&#34;</span>;
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">waku</span> <span style="color:#f92672">=</span> <span style="color:#66d9ef">await</span> <span style="color:#a6e22e">Waku</span>.<span style="color:#a6e22e">create</span>({
<span style="color:#a6e22e">bootstrap</span><span style="color:#f92672">:</span> {
<span style="color:#a6e22e">peers</span><span style="color:#f92672">:</span> [
<span style="color:#e6db74">&#34;/dns4/node-01.ac-cn-hongkong-c.wakuv2.test.statusim.net/tcp/443/wss/p2p/16Uiu2HAkvWiyFsgRhuJEb9JfjYxEkoHLgnUQmr1N5mKWnYjxYRVm&#34;</span>,
],
},
});
</code></pre></div><ol start="2">
<li>Passing an async function that returns an array of multiaddr (as <code>string</code> or <code>Multiaddr</code>):</li>
</ol>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-ts" data-lang="ts"><span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">Waku</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;js-waku&#34;</span>;
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">waku</span> <span style="color:#f92672">=</span> <span style="color:#66d9ef">await</span> <span style="color:#a6e22e">Waku</span>.<span style="color:#a6e22e">create</span>({
<span style="color:#a6e22e">bootstrap</span><span style="color:#f92672">:</span> {
<span style="color:#a6e22e">getPeers</span>: <span style="color:#66d9ef">async</span> () <span style="color:#f92672">=&gt;</span> {
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">addrs</span> <span style="color:#f92672">=</span> [];
<span style="color:#75715e">// Fetch the multiaddrs from somewhere...
</span><span style="color:#75715e"></span> <span style="color:#66d9ef">return</span> <span style="color:#a6e22e">addrs</span>;
},
},
});
</code></pre></div><blockquote class="book-hint info">
Read <a href="/docs/guides/nwaku/">Nwaku Service Node</a> to learn how to run your own node.
</blockquote>
<p><strong>Pros &amp; Cons</strong>: Same than <a href="#predefined-bootstrap-nodes">Predefined Bootstrap Nodes</a></p>
<h2 id="dns-discovery">
DNS Discovery
<a class="anchor" href="#dns-discovery">#</a>
</h2>
<p><a href="https://eips.ethereum.org/EIPS/eip-1459">EIP-1459: Node Discovery via DNS</a> has been implemented in js-waku, nwaku and go-waku
with some modification on the <a href="https://rfc.vac.dev/spec/31/">ENR format</a>.</p>
<p>DNS Discovery enables anyone to register an ENR tree in the <code>TXT</code> field of a domain name.</p>
<p><em>ENR</em> is the format used to store node connection details (ip, port, multiaddr, etc).</p>
<p>This enables a separation of software development and operations
as dApp developers can include one or several domain names to use for DNS discovery,
while operators can handle the update of the dns record.</p>
<p>It also enables more decentralized bootstrapping as anyone can register a domain name and publish it for others to use.</p>
<blockquote class="book-hint warning">
<p>While this method is implemented in js-waku,
it is currently not recommended to use due to a <a href="https://github.com/status-im/nim-waku/issues/845">bug</a> in the websocket implementation of nwaku.</p>
<p>The nwaku <a href="#nwaku-prod-fleet">prod fleet</a> and <a href="#nwaku-test-fleet">test fleet</a> have a <a href="https://github.com/novnc/websockify">websockify</a>
instance deployed alongside nwaku, acting as a work around the nwaku websocket <a href="https://github.com/status-im/nim-waku/issues/845">bug</a>.</p>
</blockquote>
<p><strong>Pros:</strong></p>
<ul>
<li>Low latency, low resource requirements,</li>
<li>Bootstrap list can be updated by editing a domain name: no code change is needed,</li>
<li>Can reference to a greater list of nodes by pointing to other domain names in the code or in the ENR tree.</li>
</ul>
<p><strong>Cons:</strong></p>
<ul>
<li>Prone to censorship: domain names can be blocked,</li>
<li>Limited: Static number of nodes, operators must provide their ENR to the domain owner to get their node listed.</li>
</ul>
<h2 id="other-discovery-mechanisms">
Other Discovery Mechanisms
<a class="anchor" href="#other-discovery-mechanisms">#</a>
</h2>
<p>Other discovery mechanisms such as gossipsub peer exchange, discv5, etc are currently being research and developed.</p>
<p>They aim to improve the current <em>status quo</em> in the following aspects:</p>
<ul>
<li>More decentralized mechanisms: Less reliance on specific entities,</li>
<li>Less setup for node operators: Enabling their nodes to be discovered by connecting to bootstrap nodes,
without having to update a domain name.</li>
</ul>
</article>
<footer class="book-footer">
<div class="flex flex-wrap justify-between">
<div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/f3adeca941c54446a327196e7502d02b9ed41a7e" title='Last modified by Franck R | Mar 10, 2022' target="_blank" rel="noopener">
<img src="/svg/calendar.svg" class="book-icon" alt="Calendar" />
<span>Mar 10, 2022</span>
</a>
</div>
<div>
<a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/edit/develop/content/docs/guides/discovery_bootstrap.md" target="_blank" rel="noopener">
<img src="/svg/edit.svg" class="book-icon" alt="Edit" />
<span>Edit this page</span>
</a>
</div>
</div>
<script>(function(){function a(c){const a=window.getSelection(),b=document.createRange();b.selectNodeContents(c),a.removeAllRanges(),a.addRange(b)}document.querySelectorAll("pre code").forEach(b=>{b.addEventListener("click",function(c){a(b.parentElement),navigator.clipboard&&navigator.clipboard.writeText(b.parentElement.textContent)})})})()</script>
</footer>
<div class="book-comments">
</div>
<label for="menu-control" class="hidden book-menu-overlay"></label>
</div>
<aside class="book-toc">
<div class="book-toc-content">
<nav id="TableOfContents">
<ul>
<li><a href="#discovery--bootstrap-nodes">Discovery &amp; Bootstrap Nodes</a>
<ul>
<li><a href="#default-bootstrap-mechanism">Default Bootstrap Mechanism</a></li>
<li><a href="#predefined-bootstrap-nodes">Predefined Bootstrap Nodes</a>
<ul>
<li><a href="#nwaku-prod-fleet">Nwaku Prod Fleet</a></li>
<li><a href="#nwaku-test-fleet">Nwaku Test Fleet</a></li>
</ul>
</li>
<li><a href="#use-your-own-nodes">Use your own nodes</a></li>
<li><a href="#dns-discovery">DNS Discovery</a></li>
<li><a href="#other-discovery-mechanisms">Other Discovery Mechanisms</a></li>
</ul>
</li>
</ul>
</nav>
</div>
</aside>
</main>
</body>
</html>

View File

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Guides # General Concepts # How to Choose a Content Topic How to Debug your Waku dApp JavaScript # Receive and Send Messages Using Waku Relay Retrieve Messages Using Waku Store Send Messages Using Waku Light Push Encrypt Messages Using Waku Message Version 1 Sign Messages Using Waku Message Version 1 Sign Messages Using a Web3 Wallet (EIP-712) ReactJS # Receive and Send Messages Using Waku Relay With ReactJS Retrieve Messages Using Waku Store With ReactJS Angular # Receive and Send Messages Using Waku Relay With ReactJS Service Nodes # Nwaku Service Node "> <meta name="description" content="Guides # General Concepts # How to Choose a Content Topic Discovery &amp; Bootstrap Nodes How to Debug your Waku dApp JavaScript # Receive and Send Messages Using Waku Relay Retrieve Messages Using Waku Store Send Messages Using Waku Light Push Encrypt Messages Using Waku Message Version 1 Sign Messages Using Waku Message Version 1 Sign Messages Using a Web3 Wallet (EIP-712) ReactJS # Receive and Send Messages Using Waku Relay With ReactJS Retrieve Messages Using Waku Store With ReactJS Angular # Receive and Send Messages Using Waku Relay With ReactJS Service Nodes # Nwaku Service Node ">
<meta name="theme-color" content="#FFFFFF"> <meta name="theme-color" content="#FFFFFF">
<meta name="color-scheme" content="light dark"><meta property="og:title" content="" /> <meta name="color-scheme" content="light dark"><meta property="og:title" content="" />
<meta property="og:description" content="" /> <meta property="og:description" content="" />
@ -15,7 +15,7 @@
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/docs/guides/index.xml" title="Waku Connect Docs" /> <link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/docs/guides/index.xml" title="Waku Connect Docs" />
<!-- <!--
Made with Book Theme Made with Book Theme
@ -187,6 +187,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>
@ -669,6 +682,7 @@ https://github.com/alex-shpak/hugo-book
</h2> </h2>
<ul> <ul>
<li><a href="./01_choose_content_topic/">How to Choose a Content Topic</a></li> <li><a href="./01_choose_content_topic/">How to Choose a Content Topic</a></li>
<li><a href="./discovery_bootstrap/">Discovery &amp; Bootstrap Nodes</a></li>
<li><a href="./debug/">How to Debug your Waku dApp</a></li> <li><a href="./debug/">How to Debug your Waku dApp</a></li>
</ul> </ul>
<h2 id="javascript"> <h2 id="javascript">
@ -714,9 +728,9 @@ https://github.com/alex-shpak/hugo-book
<div class="flex flex-wrap justify-between"> <div class="flex flex-wrap justify-between">
<div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/557b39a3f2ee6c8543ba271af1b785589a103632" title='Last modified by Franck R | Feb 24, 2022' target="_blank" rel="noopener"> <div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/4665ad7361630141514b068511ac76eb912a537f" title='Last modified by Franck R | Mar 10, 2022' target="_blank" rel="noopener">
<img src="/svg/calendar.svg" class="book-icon" alt="Calendar" /> <img src="/svg/calendar.svg" class="book-icon" alt="Calendar" />
<span>Feb 24, 2022</span> <span>Mar 10, 2022</span>
</a> </a>
</div> </div>

View File

@ -19,6 +19,16 @@ The format for content topics is as follows:
dapp-name: The name of your dApp, it must be unique to avoid conflict with other dApps. version: We usually start at 1, useful when introducing breaking changes in your messages.</description> dapp-name: The name of your dApp, it must be unique to avoid conflict with other dApps. version: We usually start at 1, useful when introducing breaking changes in your messages.</description>
</item> </item>
<item>
<title>Discovery &amp; Bootstrap Nodes</title>
<link>https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/</link>
<pubDate>Thu, 17 Feb 2022 00:00:00 +0100</pubDate>
<guid>https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/</guid>
<description>Discovery &amp;amp; Bootstrap Nodes # This guide explains the discovery and bootstrap mechanisms currently available in js-waku, their benefits and caveats and how to use them.
Node discovery is the mechanism that enables a Waku node to find other nodes. Waku is a modular protocol, several discovery mechanisms are and will be included in Waku so that developers can select the best mechanism(s) based for their use case and the user&amp;rsquo;s environment (e.</description>
</item>
<item> <item>
<title>Receive and Send Messages Using Waku Relay</title> <title>Receive and Send Messages Using Waku Relay</title>
<link>https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/</link> <link>https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/</link>

View File

@ -23,7 +23,7 @@ It is also possible to deploy your own nwaku node by following these instruction
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -194,6 +194,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -14,14 +14,14 @@ For this guide, we are build a dApp that implements 20/TOY-ETH-PM: A simple prot
<meta property="og:type" content="article" /> <meta property="og:type" content="article" />
<meta property="og:url" content="https://docs.wakuconnect.dev/docs/guides/sign_messages_web3_eip712/" /><meta property="article:section" content="docs" /> <meta property="og:url" content="https://docs.wakuconnect.dev/docs/guides/sign_messages_web3_eip712/" /><meta property="article:section" content="docs" />
<meta property="article:published_time" content="2021-12-09T14:00:00+01:00" /> <meta property="article:published_time" content="2021-12-09T14:00:00+01:00" />
<meta property="article:modified_time" content="2022-02-24T16:49:46+11:00" /> <meta property="article:modified_time" content="2022-03-10T16:45:38+11:00" />
<title>Sign Messages Using a Web3 Wallet (EIP-712) | Waku Connect Docs</title> <title>Sign Messages Using a Web3 Wallet (EIP-712) | Waku Connect Docs</title>
<link rel="manifest" href="/manifest.json"> <link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -192,6 +192,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>
@ -799,7 +812,7 @@ Alice&rsquo;s Ethereum account <em>A</em>.</p>
<p>Use the following function to do so:</p> <p>Use the following function to do so:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-ts" data-lang="ts"><span style="color:#66d9ef">import</span> <span style="color:#f92672">*</span> <span style="color:#66d9ef">as</span> <span style="color:#a6e22e">sigUtil</span> <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;eth-sig-util&#34;</span>; <div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-ts" data-lang="ts"><span style="color:#66d9ef">import</span> <span style="color:#f92672">*</span> <span style="color:#66d9ef">as</span> <span style="color:#a6e22e">sigUtil</span> <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;eth-sig-util&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">keccak256</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;ethers/lib/utils&#34;</span>; <span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">keccak256</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;ethers/lib/utils&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">hexToBytes</span>, <span style="color:#a6e22e">equalByteArrays</span>, <span style="color:#a6e22e">bytesToHex</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;js-waku/lib/utils&#34;</span>; <span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">utils</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;js-waku&#34;</span>;
<span style="color:#66d9ef">interface</span> <span style="color:#a6e22e">PublicKeyMessage</span> { <span style="color:#66d9ef">interface</span> <span style="color:#a6e22e">PublicKeyMessage</span> {
<span style="color:#a6e22e">encryptionPublicKey</span>: <span style="color:#66d9ef">Uint8Array</span>; <span style="color:#a6e22e">encryptionPublicKey</span>: <span style="color:#66d9ef">Uint8Array</span>;
@ -839,9 +852,9 @@ where the signature is then used in a <a href="https://github.com/status-im/waku
<div class="flex flex-wrap justify-between"> <div class="flex flex-wrap justify-between">
<div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/557b39a3f2ee6c8543ba271af1b785589a103632" title='Last modified by Franck R | Feb 24, 2022' target="_blank" rel="noopener"> <div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/4665ad7361630141514b068511ac76eb912a537f" title='Last modified by Franck R | Mar 10, 2022' target="_blank" rel="noopener">
<img src="/svg/calendar.svg" class="book-icon" alt="Calendar" /> <img src="/svg/calendar.svg" class="book-icon" alt="Calendar" />
<span>Feb 24, 2022</span> <span>Mar 10, 2022</span>
</a> </a>
</div> </div>

View File

@ -23,7 +23,7 @@ The latest react-scripts version uses webpack 5." />
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -194,6 +194,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -17,7 +17,7 @@
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -188,6 +188,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -19,7 +19,7 @@ yarn add @usedapp/core@0.4.7 @usedapp/core must be frozen to version 0.4.7 due t
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -190,6 +190,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -18,7 +18,7 @@ The Poll &amp; Vote SDK features can only be used by token holders, you must pas
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/index.xml" title="Waku Connect Docs" /> <link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/index.xml" title="Waku Connect Docs" />
<!-- <!--
Made with Book Theme Made with Book Theme
@ -190,6 +190,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -18,7 +18,7 @@ For both functionalities, only ERC-20 token holders can create or answer polls/v
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/index.xml" title="Waku Connect Docs" /> <link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/index.xml" title="Waku Connect Docs" />
<!-- <!--
Made with Book Theme Made with Book Theme
@ -190,6 +190,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -21,7 +21,7 @@ import styled from &#34;styled-components&#34;; const Wrapper = styled.div` disp
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -192,6 +192,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -0,0 +1,741 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Create the DApp and Install Dependencies # Create React App # Create the new React app using the typescript template. Install the Waku Poll SDK packages.
In this guide, we use useDApp to access the blockchain.
yarn create react-app poll-dapp-ts --template typescript cd poll-dapp-ts yarn add \ @waku/poll-sdk-react-components @waku/poll-sdk-react-hooks @waku/vote-poll-sdk-react-components \ @usedapp/core@0.4.7 yarn add -D @types/styled-components @usedapp/core must be frozen to version 0.4.7 due to incompatibility between minor versions of ethers.">
<meta name="theme-color" content="#FFFFFF">
<meta name="color-scheme" content="light dark"><meta property="og:title" content="Create the DApp and Install Dependencies" />
<meta property="og:description" content="Create the DApp and Install Dependencies # Create React App # Create the new React app using the typescript template. Install the Waku Poll SDK packages.
In this guide, we use useDApp to access the blockchain.
yarn create react-app poll-dapp-ts --template typescript cd poll-dapp-ts yarn add \ @waku/poll-sdk-react-components @waku/poll-sdk-react-hooks @waku/vote-poll-sdk-react-components \ @usedapp/core@0.4.7 yarn add -D @types/styled-components @usedapp/core must be frozen to version 0.4.7 due to incompatibility between minor versions of ethers." />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/01_create_dapp/" /><meta property="article:section" content="docs" />
<meta property="article:published_time" content="2022-01-03T11:00:00+11:00" />
<meta property="article:modified_time" content="2022-01-27T11:18:41+11:00" />
<title>Create the DApp and Install Dependencies | Waku Connect Docs</title>
<link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.529c80d1e911ec8f549a29bff1dd2c31fc706122b64f877c8a14e63ba53421c7.js" integrity="sha256-UpyA0ekR7I9Umim/8d0sMfxwYSK2T4d8ihTmO6U0Icc=" crossorigin="anonymous"></script>
<!--
Made with Book Theme
https://github.com/alex-shpak/hugo-book
-->
</head>
<body dir="ltr">
<input type="checkbox" class="hidden toggle" id="menu-control" />
<input type="checkbox" class="hidden toggle" id="toc-control" />
<main class="container flex">
<aside class="book-menu">
<div class="book-menu-content">
<nav>
<h2 class="book-brand">
<a class="flex align-center" href="/"><span>Waku Connect Docs</span>
</a>
</h2>
<div class="book-search">
<input type="text" id="book-search-input" placeholder="Search" aria-label="Search" maxlength="64" data-hotkeys="s/" />
<div class="book-search-spinner hidden"></div>
<ul id="book-search-results"></ul>
</div>
<ul class="book-languages">
<li>
<input type="checkbox" id="languages" class="toggle" />
<label for="languages" class="flex justify-between">
<a role="button" class="flex align-center">
<img src="/svg/translate.svg" class="book-icon" alt="Languages" />
English
</a>
</label>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/es/">
Español
</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/pt/">
Português
</a>
</li>
</ul>
</li>
</ul>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/introduction/" class="">Introduction</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/quick_start/" class="">Quick Start</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/use_cases/" class="">Use Cases</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/presentations/" class="">Presentations &amp; Videos</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/" class="">Guides</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/01_choose_content_topic/" class="">How to Choose a Content Topic</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/03_store_retrieve_messages/" class="">Retrieve Messages Using Waku Store</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/04_encrypt_messages_version_1/" class="">Encrypt Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/05_sign_messages_version_1/" class="">Sign Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/06_light_push_send_messages/" class="">Send Messages Using Waku Light Push</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/07_reactjs_relay/" class="">Receive and Send Messages Using Waku Relay With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/08_reactjs_store/" class="">Retrieve Messages Using Waku Store With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/09_debug/" class="">How to Debug your Waku dApp</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/" class="">Vote Poll Sdk</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/" class="">Poll SDK</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/01_create_dapp/" class=" active">Create the DApp and Install Dependencies</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/02_connect_wallet/" class="">Connect to the Ethereum Wallet</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/03_create-a-poll_button/" class="">Create-A-Poll Button</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/04_poll_creation/" class="">Poll Creation Component</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/05_poll_list/" class="">Poll List Component</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/examples/" class="">Examples</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/crypto_libraries/" class="">Cryptographic Libraries</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/waku_protocols/" class="">Implemented Waku Protocols</a>
</li>
</ul>
<ul>
<li>
<a href="https://js-waku.wakuconnect.dev/" target="_blank" rel="noopener">
JS-Waku API Doc
</a>
</li>
<li>
<a href="https://vac.dev/" target="_blank" rel="noopener">
Vac Team
</a>
</li>
<li>
<a href="https://rfc.vac.dev/" target="_blank" rel="noopener">
Vac RFCs
</a>
</li>
<li>
<a href="https://status.im/" target="_blank" rel="noopener">
Status.im
</a>
</li>
</ul>
</nav>
<script>(function(){var a=document.querySelector("aside .book-menu-content");addEventListener("beforeunload",function(b){localStorage.setItem("menu.scrollTop",a.scrollTop)}),a.scrollTop=localStorage.getItem("menu.scrollTop")})()</script>
</div>
</aside>
<div class="book-page">
<header class="book-header">
<div class="flex align-center justify-between">
<label for="menu-control">
<img src="/svg/menu.svg" class="book-icon" alt="Menu" />
</label>
<strong>Create the DApp and Install Dependencies</strong>
<label for="toc-control">
<img src="/svg/toc.svg" class="book-icon" alt="Table of Contents" />
</label>
</div>
<aside class="hidden clearfix">
<nav id="TableOfContents">
<ul>
<li><a href="#create-the-dapp-and-install-dependencies">Create the DApp and Install Dependencies</a>
<ul>
<li><a href="#create-react-app">Create React App</a></li>
<li><a href="#setup-polyfills">Setup polyfills</a>
<ul>
<li><a href="#webpack-5">Webpack 5</a></li>
<li><a href="#react-app-rewired">React-App-Rewired</a></li>
</ul>
</li>
<li><a href="#start-development-server">Start development server</a></li>
</ul>
</li>
</ul>
</nav>
</aside>
</header>
<article class="markdown"><h1 id="create-the-dapp-and-install-dependencies">
Create the DApp and Install Dependencies
<a class="anchor" href="#create-the-dapp-and-install-dependencies">#</a>
</h1>
<h2 id="create-react-app">
Create React App
<a class="anchor" href="#create-react-app">#</a>
</h2>
<p>Create the new React app using the <code>typescript</code> template.
Install the Waku Poll SDK packages.</p>
<p>In this guide, we use <a href="https://usedapp.io/">useDApp</a> to access the blockchain.</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-shell" data-lang="shell">yarn create react-app poll-dapp-ts --template typescript
cd poll-dapp-ts
yarn add <span style="color:#ae81ff">\
</span><span style="color:#ae81ff"></span>@waku/poll-sdk-react-components @waku/poll-sdk-react-hooks @waku/vote-poll-sdk-react-components <span style="color:#ae81ff">\
</span><span style="color:#ae81ff"></span>@usedapp/core@0.4.7
yarn add -D @types/styled-components
</code></pre></div><blockquote class="book-hint warning">
<p><code>@usedapp/core</code> must be frozen to version <code>0.4.7</code> due to incompatibility between minor versions of <code>ethers</code>.</p>
<p>Waku Connect Vote &amp; Poll SDK will be upgraded to the latest version of <code>@usedapp/core</code> and <code>ethers</code> once <code>ethereum-waffle</code>
is released with the <a href="https://github.com/EthWorks/Waffle/pull/603">latest version of <code>ethers</code></a>.</p>
</blockquote>
<h2 id="setup-polyfills">
Setup polyfills
<a class="anchor" href="#setup-polyfills">#</a>
</h2>
<p>A number of Web3 dependencies need polyfills.
Said polyfills must be explicitly declared when using webpack 5.</p>
<p>The latest <code>react-scripts</code> version uses webpack 5.</p>
<p>We will describe below a method to configure polyfills when using <code>create-react-app</code>/<code>react-scripts</code> or webpack 5.
This may not be necessary if you do not use <code>react-scripts</code> or if you use webpack 4.</p>
<p>Start by installing the polyfill libraries:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-shell" data-lang="shell">yarn add assert buffer crypto-browserify stream-browserify
</code></pre></div><h3 id="webpack-5">
Webpack 5
<a class="anchor" href="#webpack-5">#</a>
</h3>
<p>If you directly use webpack 5,
then you can inspire yourself from this <a href="https://github.com/status-im/wakuconnect-vote-poll-sdk/blob/main/examples/mainnet-poll/webpack.config.js">webpack.config.js</a>.</p>
<h3 id="react-app-rewired">
React-App-Rewired
<a class="anchor" href="#react-app-rewired">#</a>
</h3>
<p>An alternative is to let <code>react-scripts</code> control the webpack 5 config and only override some elements using <code>react-app-rewired</code>.</p>
<p>Install <code>react-app-rewired</code>:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-shell" data-lang="shell">yarn add -D react-app-rewired
</code></pre></div><p>Create a <code>config-overrides.js</code> file at the root of your app:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-js" data-lang="js"><span style="color:#66d9ef">const</span> <span style="color:#a6e22e">webpack</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">require</span>(<span style="color:#e6db74">&#34;webpack&#34;</span>);
<span style="color:#a6e22e">module</span>.<span style="color:#a6e22e">exports</span> <span style="color:#f92672">=</span> (<span style="color:#a6e22e">config</span>) =&gt; {
<span style="color:#75715e">// Override webpack 5 config from react-scripts to load polyfills
</span><span style="color:#75715e"></span> <span style="color:#66d9ef">if</span> (<span style="color:#f92672">!</span><span style="color:#a6e22e">config</span>.<span style="color:#a6e22e">resolve</span>) <span style="color:#a6e22e">config</span>.<span style="color:#a6e22e">resolve</span> <span style="color:#f92672">=</span> {};
<span style="color:#66d9ef">if</span> (<span style="color:#f92672">!</span><span style="color:#a6e22e">config</span>.<span style="color:#a6e22e">resolve</span>.<span style="color:#a6e22e">fallback</span>) <span style="color:#a6e22e">config</span>.<span style="color:#a6e22e">resolve</span>.<span style="color:#a6e22e">fallback</span> <span style="color:#f92672">=</span> {};
Object.<span style="color:#a6e22e">assign</span>(<span style="color:#a6e22e">config</span>.<span style="color:#a6e22e">resolve</span>.<span style="color:#a6e22e">fallback</span>, {
<span style="color:#a6e22e">buffer</span><span style="color:#f92672">:</span> <span style="color:#a6e22e">require</span>.<span style="color:#a6e22e">resolve</span>(<span style="color:#e6db74">&#34;buffer&#34;</span>),
<span style="color:#a6e22e">crypto</span><span style="color:#f92672">:</span> <span style="color:#a6e22e">require</span>.<span style="color:#a6e22e">resolve</span>(<span style="color:#e6db74">&#34;crypto-browserify&#34;</span>),
<span style="color:#a6e22e">stream</span><span style="color:#f92672">:</span> <span style="color:#a6e22e">require</span>.<span style="color:#a6e22e">resolve</span>(<span style="color:#e6db74">&#34;stream-browserify&#34;</span>),
<span style="color:#a6e22e">assert</span><span style="color:#f92672">:</span> <span style="color:#a6e22e">require</span>.<span style="color:#a6e22e">resolve</span>(<span style="color:#e6db74">&#34;assert&#34;</span>),
});
<span style="color:#66d9ef">if</span> (<span style="color:#f92672">!</span><span style="color:#a6e22e">config</span>.<span style="color:#a6e22e">plugins</span>) <span style="color:#a6e22e">config</span>.<span style="color:#a6e22e">plugins</span> <span style="color:#f92672">=</span> [];
<span style="color:#a6e22e">config</span>.<span style="color:#a6e22e">plugins</span>.<span style="color:#a6e22e">push</span>(
<span style="color:#66d9ef">new</span> <span style="color:#a6e22e">webpack</span>.<span style="color:#a6e22e">ProvidePlugin</span>({
<span style="color:#a6e22e">Buffer</span><span style="color:#f92672">:</span> [<span style="color:#e6db74">&#34;buffer&#34;</span>, <span style="color:#e6db74">&#34;Buffer&#34;</span>],
})
);
<span style="color:#66d9ef">return</span> <span style="color:#a6e22e">config</span>;
};
</code></pre></div><p>Use <code>react-app-rewired</code> in the <code>package.json</code>, instead of <code>react-scripts</code>:</p>
<pre tabindex="0"><code> &quot;scripts&quot;: {
- &quot;start&quot;: &quot;react-scripts start&quot;,
- &quot;build&quot;: &quot;react-scripts build&quot;,
- &quot;test&quot;: &quot;react-scripts test&quot;,
- &quot;eject&quot;: &quot;react-scripts eject&quot;
+ &quot;start&quot;: &quot;react-app-rewired start&quot;,
+ &quot;build&quot;: &quot;react-app-rewired build&quot;,
+ &quot;test&quot;: &quot;react-app-rewired test&quot;,
+ &quot;eject&quot;: &quot;react-app-rewired eject&quot;
},
</code></pre><h2 id="start-development-server">
Start development server
<a class="anchor" href="#start-development-server">#</a>
</h2>
<p>You can now start the development server to serve your dApp at http://localhost:3000/ while we code:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-shell" data-lang="shell">yarn start
</code></pre></div><p>
<a href="/docs/guides/vote_poll_sdk/poll_sdk/" class="book-btn">
Back
</a>
<a href="/docs/guides/vote_poll_sdk/poll_sdk/02_connect_wallet/" class="book-btn">
Next: Connect to the Ethereum Wallet
</a>
</p>
</article>
<footer class="book-footer">
<div class="flex flex-wrap justify-between">
<div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/02d5ab77d041a7324a534578b8604b82cc61deec" title='Last modified by Franck R | Jan 27, 2022' target="_blank" rel="noopener">
<img src="/svg/calendar.svg" class="book-icon" alt="Calendar" />
<span>Jan 27, 2022</span>
</a>
</div>
<div>
<a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/edit/develop/content/docs/guides/vote_poll_sdk/poll_sdk/01_create_dapp.md" target="_blank" rel="noopener">
<img src="/svg/edit.svg" class="book-icon" alt="Edit" />
<span>Edit this page</span>
</a>
</div>
</div>
<script>(function(){function a(c){const a=window.getSelection(),b=document.createRange();b.selectNodeContents(c),a.removeAllRanges(),a.addRange(b)}document.querySelectorAll("pre code").forEach(b=>{b.addEventListener("click",function(c){a(b.parentElement),navigator.clipboard&&navigator.clipboard.writeText(b.parentElement.textContent)})})})()</script>
</footer>
<div class="book-comments">
</div>
<label for="menu-control" class="hidden book-menu-overlay"></label>
</div>
<aside class="book-toc">
<div class="book-toc-content">
<nav id="TableOfContents">
<ul>
<li><a href="#create-the-dapp-and-install-dependencies">Create the DApp and Install Dependencies</a>
<ul>
<li><a href="#create-react-app">Create React App</a></li>
<li><a href="#setup-polyfills">Setup polyfills</a>
<ul>
<li><a href="#webpack-5">Webpack 5</a></li>
<li><a href="#react-app-rewired">React-App-Rewired</a></li>
</ul>
</li>
<li><a href="#start-development-server">Start development server</a></li>
</ul>
</li>
</ul>
</nav>
</div>
</aside>
</main>
</body>
</html>

View File

@ -0,0 +1,835 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Connect to the Ethereum Wallet # This section may be skipped if you are adding the poll feature to an existing dApp that already connects to the user&rsquo;s wallet. Delete the template App component:
rm -f App.tsx App.css App.test.tsx Top bar # Use TopBar component to display wallet information. For that, create a PollPage component that includes the top bar and will include the poll elements. The component uses ethers to connect to the user&rsquo;s wallet:">
<meta name="theme-color" content="#FFFFFF">
<meta name="color-scheme" content="light dark"><meta property="og:title" content="Connect to the Ethereum Wallet" />
<meta property="og:description" content="Connect to the Ethereum Wallet # This section may be skipped if you are adding the poll feature to an existing dApp that already connects to the user&rsquo;s wallet. Delete the template App component:
rm -f App.tsx App.css App.test.tsx Top bar # Use TopBar component to display wallet information. For that, create a PollPage component that includes the top bar and will include the poll elements. The component uses ethers to connect to the user&rsquo;s wallet:" />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/02_connect_wallet/" /><meta property="article:section" content="docs" />
<meta property="article:published_time" content="2022-01-03T11:00:00+11:00" />
<meta property="article:modified_time" content="2022-01-24T12:17:00+11:00" />
<title>Connect to the Ethereum Wallet | Waku Connect Docs</title>
<link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.529c80d1e911ec8f549a29bff1dd2c31fc706122b64f877c8a14e63ba53421c7.js" integrity="sha256-UpyA0ekR7I9Umim/8d0sMfxwYSK2T4d8ihTmO6U0Icc=" crossorigin="anonymous"></script>
<!--
Made with Book Theme
https://github.com/alex-shpak/hugo-book
-->
</head>
<body dir="ltr">
<input type="checkbox" class="hidden toggle" id="menu-control" />
<input type="checkbox" class="hidden toggle" id="toc-control" />
<main class="container flex">
<aside class="book-menu">
<div class="book-menu-content">
<nav>
<h2 class="book-brand">
<a class="flex align-center" href="/"><span>Waku Connect Docs</span>
</a>
</h2>
<div class="book-search">
<input type="text" id="book-search-input" placeholder="Search" aria-label="Search" maxlength="64" data-hotkeys="s/" />
<div class="book-search-spinner hidden"></div>
<ul id="book-search-results"></ul>
</div>
<ul class="book-languages">
<li>
<input type="checkbox" id="languages" class="toggle" />
<label for="languages" class="flex justify-between">
<a role="button" class="flex align-center">
<img src="/svg/translate.svg" class="book-icon" alt="Languages" />
English
</a>
</label>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/es/">
Español
</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/pt/">
Português
</a>
</li>
</ul>
</li>
</ul>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/introduction/" class="">Introduction</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/quick_start/" class="">Quick Start</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/use_cases/" class="">Use Cases</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/presentations/" class="">Presentations &amp; Videos</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/" class="">Guides</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/01_choose_content_topic/" class="">How to Choose a Content Topic</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/03_store_retrieve_messages/" class="">Retrieve Messages Using Waku Store</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/04_encrypt_messages_version_1/" class="">Encrypt Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/05_sign_messages_version_1/" class="">Sign Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/06_light_push_send_messages/" class="">Send Messages Using Waku Light Push</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/07_reactjs_relay/" class="">Receive and Send Messages Using Waku Relay With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/08_reactjs_store/" class="">Retrieve Messages Using Waku Store With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/09_debug/" class="">How to Debug your Waku dApp</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/" class="">Vote Poll Sdk</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/" class="">Poll SDK</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/01_create_dapp/" class="">Create the DApp and Install Dependencies</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/02_connect_wallet/" class=" active">Connect to the Ethereum Wallet</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/03_create-a-poll_button/" class="">Create-A-Poll Button</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/04_poll_creation/" class="">Poll Creation Component</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/05_poll_list/" class="">Poll List Component</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/examples/" class="">Examples</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/crypto_libraries/" class="">Cryptographic Libraries</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/waku_protocols/" class="">Implemented Waku Protocols</a>
</li>
</ul>
<ul>
<li>
<a href="https://js-waku.wakuconnect.dev/" target="_blank" rel="noopener">
JS-Waku API Doc
</a>
</li>
<li>
<a href="https://vac.dev/" target="_blank" rel="noopener">
Vac Team
</a>
</li>
<li>
<a href="https://rfc.vac.dev/" target="_blank" rel="noopener">
Vac RFCs
</a>
</li>
<li>
<a href="https://status.im/" target="_blank" rel="noopener">
Status.im
</a>
</li>
</ul>
</nav>
<script>(function(){var a=document.querySelector("aside .book-menu-content");addEventListener("beforeunload",function(b){localStorage.setItem("menu.scrollTop",a.scrollTop)}),a.scrollTop=localStorage.getItem("menu.scrollTop")})()</script>
</div>
</aside>
<div class="book-page">
<header class="book-header">
<div class="flex align-center justify-between">
<label for="menu-control">
<img src="/svg/menu.svg" class="book-icon" alt="Menu" />
</label>
<strong>Connect to the Ethereum Wallet</strong>
<label for="toc-control">
<img src="/svg/toc.svg" class="book-icon" alt="Table of Contents" />
</label>
</div>
<aside class="hidden clearfix">
<nav id="TableOfContents">
<ul>
<li><a href="#connect-to-the-ethereum-wallet">Connect to the Ethereum Wallet</a>
<ul>
<li><a href="#top-bar">Top bar</a></li>
<li><a href="#page">Page</a>
<ul>
<li><a href="#usedapp">UseDApp</a></li>
<li><a href="#styled-components">Styled-components</a></li>
<li><a href="#render">Render</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>
</aside>
</header>
<article class="markdown"><h1 id="connect-to-the-ethereum-wallet">
Connect to the Ethereum Wallet
<a class="anchor" href="#connect-to-the-ethereum-wallet">#</a>
</h1>
<blockquote class="book-hint info">
This section may be skipped if you are adding the poll feature to an existing dApp
that already connects to the user&rsquo;s wallet.
</blockquote>
<p>Delete the template <code>App</code> component:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-shell" data-lang="shell">rm -f App.tsx App.css App.test.tsx
</code></pre></div><h2 id="top-bar">
Top bar
<a class="anchor" href="#top-bar">#</a>
</h2>
<p>Use <code>TopBar</code> component to display wallet information.
For that, create a <code>PollPage</code> component that includes the top bar and will include the poll elements.
The component uses <code>ethers</code> to connect to the user&rsquo;s wallet:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-tsx" data-lang="tsx"><span style="color:#66d9ef">export</span> <span style="color:#66d9ef">function</span> <span style="color:#a6e22e">PollPage() {</span>
<span style="color:#66d9ef">const</span> { <span style="color:#a6e22e">account</span>, <span style="color:#a6e22e">library</span>, <span style="color:#a6e22e">activateBrowserWallet</span>, <span style="color:#a6e22e">deactivate</span> } <span style="color:#f92672">=</span> <span style="color:#a6e22e">useEthers</span>();
<span style="color:#66d9ef">const</span> [<span style="color:#a6e22e">signer</span>, <span style="color:#a6e22e">setSigner</span>] <span style="color:#f92672">=</span> <span style="color:#a6e22e">useState</span>&lt;<span style="color:#f92672">undefined</span> <span style="color:#960050;background-color:#1e0010">|</span> <span style="color:#a6e22e">JsonRpcSigner</span>&gt;(<span style="color:#66d9ef">undefined</span>);
<span style="color:#a6e22e">useEffect</span>(() <span style="color:#f92672">=&gt;</span> {
<span style="color:#66d9ef">if</span> (<span style="color:#a6e22e">account</span>) {
<span style="color:#a6e22e">setSigner</span>(<span style="color:#a6e22e">library</span><span style="color:#f92672">?</span>.<span style="color:#a6e22e">getSigner</span>());
} <span style="color:#66d9ef">else</span> {
<span style="color:#75715e">// Deactivate signer if signed out
</span><span style="color:#75715e"></span> <span style="color:#a6e22e">setSigner</span>(<span style="color:#66d9ef">undefined</span>);
}
}, [<span style="color:#a6e22e">account</span>]);
<span style="color:#66d9ef">return</span> (
&lt;<span style="color:#f92672">div</span>&gt;
&lt;<span style="color:#f92672">TopBar</span>
<span style="color:#a6e22e">logo</span><span style="color:#f92672">=</span>{<span style="color:#e6db74">&#34;&#34;</span>}
<span style="color:#a6e22e">logoWidth</span><span style="color:#f92672">=</span>{<span style="color:#ae81ff">84</span>}
<span style="color:#a6e22e">title</span><span style="color:#f92672">=</span>{<span style="color:#e6db74">&#34;Poll dApp&#34;</span>}
<span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">orangeTheme</span>}
<span style="color:#a6e22e">activate</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">activateBrowserWallet</span>}
<span style="color:#a6e22e">account</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">account</span>}
<span style="color:#a6e22e">deactivate</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">deactivate</span>}
/&gt;
&lt;/<span style="color:#f92672">div</span>&gt;
);
}
</code></pre></div><h2 id="page">
Page
<a class="anchor" href="#page">#</a>
</h2>
<h3 id="usedapp">
UseDApp
<a class="anchor" href="#usedapp">#</a>
</h3>
<p>Create a <code>config</code> variable that contains the Ethereum network parameters:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-tsx" data-lang="tsx"><span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">ChainId</span>, <span style="color:#a6e22e">DAppProvider</span>, <span style="color:#a6e22e">useEthers</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@usedapp/core&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">DEFAULT_CONFIG</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@usedapp/core/dist/cjs/src/model/config/default&#34;</span>;
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">config</span> <span style="color:#f92672">=</span> {
<span style="color:#a6e22e">readOnlyChainId</span>: <span style="color:#66d9ef">ChainId.Mainnet</span>,
<span style="color:#a6e22e">readOnlyUrls</span><span style="color:#f92672">:</span> {
[<span style="color:#a6e22e">ChainId</span>.<span style="color:#a6e22e">Mainnet</span>]<span style="color:#f92672">:</span> <span style="color:#e6db74">&#34;https://mainnet.infura.io/v3/your-infura-token&#34;</span>,
},
<span style="color:#a6e22e">multicallAddresses</span><span style="color:#f92672">:</span> {
<span style="color:#ae81ff">1</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#34;0xeefba1e63905ef1d7acba5a8513c70307c1ce441&#34;</span>,
<span style="color:#ae81ff">3</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#34;0x53c43764255c17bd724f74c4ef150724ac50a3ed&#34;</span>,
<span style="color:#a6e22e">1337</span>:
<span style="color:#66d9ef">process.env.GANACHE_MULTICALL_CONTRACT</span> <span style="color:#f92672">??</span>
<span style="color:#e6db74">&#34;0x0000000000000000000000000000000000000000&#34;</span>,
},
<span style="color:#a6e22e">supportedChains</span><span style="color:#f92672">:</span> [...<span style="color:#a6e22e">DEFAULT_CONFIG</span>.<span style="color:#a6e22e">supportedChains</span>, <span style="color:#ae81ff">1337</span>],
<span style="color:#a6e22e">notifications</span><span style="color:#f92672">:</span> {
<span style="color:#a6e22e">checkInterval</span>: <span style="color:#66d9ef">500</span>,
<span style="color:#a6e22e">expirationPeriod</span>: <span style="color:#66d9ef">50000</span>,
},
};
</code></pre></div><p>Replace <code>your-infura-token</code> with your <a href="https://infura.io/docs/ethereum">Infura API token</a>.</p>
<h3 id="styled-components">
Styled-components
<a class="anchor" href="#styled-components">#</a>
</h3>
<p><a href="https://styled-components.com/"><code>styled-components</code></a> is used for easy styling.
Create a <code>Wrapper</code> variable to use in the page component:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-tsx" data-lang="tsx"><span style="color:#66d9ef">import</span> <span style="color:#a6e22e">styled</span> <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;styled-components&#34;</span>;
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">Wrapper</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">styled</span>.<span style="color:#a6e22e">div</span><span style="color:#e6db74">`
</span><span style="color:#e6db74"> height: 100%;
</span><span style="color:#e6db74"> width: 100%;
</span><span style="color:#e6db74">`</span>;
</code></pre></div><h3 id="render">
Render
<a class="anchor" href="#render">#</a>
</h3>
<p>Finally, create the <code>App</code> component:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-tsx" data-lang="tsx"><span style="color:#66d9ef">export</span> <span style="color:#66d9ef">function</span> <span style="color:#a6e22e">App() {</span>
<span style="color:#66d9ef">return</span> (
&lt;<span style="color:#f92672">Wrapper</span>&gt;
&lt;<span style="color:#f92672">GlobalStyle</span> /&gt;
&lt;<span style="color:#f92672">DAppProvider</span> <span style="color:#a6e22e">config</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">config</span>}&gt;
&lt;<span style="color:#f92672">PollPage</span> /&gt;
&lt;/<span style="color:#f92672">DAppProvider</span>&gt;
&lt;/<span style="color:#f92672">Wrapper</span>&gt;
);
}
</code></pre></div><p>Your <code>index.tsx</code> should now be:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-tsx" data-lang="tsx"><span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">ChainId</span>, <span style="color:#a6e22e">DAppProvider</span>, <span style="color:#a6e22e">useEthers</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@usedapp/core&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">GlobalStyle</span>, <span style="color:#a6e22e">TopBar</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@waku/vote-poll-sdk-react-components&#34;</span>;
<span style="color:#66d9ef">import</span> <span style="color:#a6e22e">React</span>, { <span style="color:#a6e22e">useEffect</span>, <span style="color:#a6e22e">useState</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;react&#34;</span>;
<span style="color:#66d9ef">import</span> <span style="color:#a6e22e">ReactDOM</span> <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;react-dom&#34;</span>;
<span style="color:#66d9ef">import</span> <span style="color:#e6db74">&#34;./index.css&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">JsonRpcSigner</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@ethersproject/providers&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">orangeTheme</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@waku/vote-poll-sdk-react-components/dist/cjs/src/style/themes&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">DEFAULT_CONFIG</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@usedapp/core/dist/cjs/src/model/config/default&#34;</span>;
<span style="color:#66d9ef">import</span> <span style="color:#a6e22e">styled</span> <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;styled-components&#34;</span>;
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">config</span> <span style="color:#f92672">=</span> {
<span style="color:#a6e22e">readOnlyChainId</span>: <span style="color:#66d9ef">ChainId.Mainnet</span>,
<span style="color:#a6e22e">readOnlyUrls</span><span style="color:#f92672">:</span> {
[<span style="color:#a6e22e">ChainId</span>.<span style="color:#a6e22e">Mainnet</span>]<span style="color:#f92672">:</span>
<span style="color:#e6db74">&#34;https://mainnet.infura.io/v3/b4451d780cc64a078ccf2181e872cfcf&#34;</span>,
},
<span style="color:#a6e22e">multicallAddresses</span><span style="color:#f92672">:</span> {
<span style="color:#ae81ff">1</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#34;0xeefba1e63905ef1d7acba5a8513c70307c1ce441&#34;</span>,
<span style="color:#ae81ff">3</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#34;0x53c43764255c17bd724f74c4ef150724ac50a3ed&#34;</span>,
<span style="color:#a6e22e">1337</span>:
<span style="color:#66d9ef">process.env.GANACHE_MULTICALL_CONTRACT</span> <span style="color:#f92672">??</span>
<span style="color:#e6db74">&#34;0x0000000000000000000000000000000000000000&#34;</span>,
},
<span style="color:#a6e22e">supportedChains</span><span style="color:#f92672">:</span> [...<span style="color:#a6e22e">DEFAULT_CONFIG</span>.<span style="color:#a6e22e">supportedChains</span>, <span style="color:#ae81ff">1337</span>],
<span style="color:#a6e22e">notifications</span><span style="color:#f92672">:</span> {
<span style="color:#a6e22e">checkInterval</span>: <span style="color:#66d9ef">500</span>,
<span style="color:#a6e22e">expirationPeriod</span>: <span style="color:#66d9ef">50000</span>,
},
};
<span style="color:#66d9ef">export</span> <span style="color:#66d9ef">function</span> <span style="color:#a6e22e">PollPage() {</span>
<span style="color:#66d9ef">const</span> { <span style="color:#a6e22e">account</span>, <span style="color:#a6e22e">library</span>, <span style="color:#a6e22e">activateBrowserWallet</span>, <span style="color:#a6e22e">deactivate</span> } <span style="color:#f92672">=</span> <span style="color:#a6e22e">useEthers</span>();
<span style="color:#66d9ef">const</span> [<span style="color:#a6e22e">signer</span>, <span style="color:#a6e22e">setSigner</span>] <span style="color:#f92672">=</span> <span style="color:#a6e22e">useState</span>&lt;<span style="color:#f92672">undefined</span> <span style="color:#960050;background-color:#1e0010">|</span> <span style="color:#a6e22e">JsonRpcSigner</span>&gt;(<span style="color:#66d9ef">undefined</span>);
<span style="color:#a6e22e">useEffect</span>(() <span style="color:#f92672">=&gt;</span> {
<span style="color:#66d9ef">if</span> (<span style="color:#a6e22e">account</span>) {
<span style="color:#a6e22e">setSigner</span>(<span style="color:#a6e22e">library</span><span style="color:#f92672">?</span>.<span style="color:#a6e22e">getSigner</span>());
} <span style="color:#66d9ef">else</span> {
<span style="color:#75715e">// Deactivate signer if signed out
</span><span style="color:#75715e"></span> <span style="color:#a6e22e">setSigner</span>(<span style="color:#66d9ef">undefined</span>);
}
}, [<span style="color:#a6e22e">account</span>]);
<span style="color:#66d9ef">return</span> (
&lt;<span style="color:#f92672">div</span>&gt;
&lt;<span style="color:#f92672">TopBar</span>
<span style="color:#a6e22e">logo</span><span style="color:#f92672">=</span>{<span style="color:#e6db74">&#34;&#34;</span>}
<span style="color:#a6e22e">logoWidth</span><span style="color:#f92672">=</span>{<span style="color:#ae81ff">84</span>}
<span style="color:#a6e22e">title</span><span style="color:#f92672">=</span>{<span style="color:#e6db74">&#34;Poll dApp&#34;</span>}
<span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">orangeTheme</span>}
<span style="color:#a6e22e">activate</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">activateBrowserWallet</span>}
<span style="color:#a6e22e">account</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">account</span>}
<span style="color:#a6e22e">deactivate</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">deactivate</span>}
/&gt;
&lt;/<span style="color:#f92672">div</span>&gt;
);
}
<span style="color:#66d9ef">export</span> <span style="color:#66d9ef">function</span> <span style="color:#a6e22e">App() {</span>
<span style="color:#66d9ef">return</span> (
&lt;<span style="color:#f92672">Wrapper</span>&gt;
&lt;<span style="color:#f92672">GlobalStyle</span> /&gt;
&lt;<span style="color:#f92672">DAppProvider</span> <span style="color:#a6e22e">config</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">config</span>}&gt;
&lt;<span style="color:#f92672">PollPage</span> /&gt;
&lt;/<span style="color:#f92672">DAppProvider</span>&gt;
&lt;/<span style="color:#f92672">Wrapper</span>&gt;
);
}
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">Wrapper</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">styled</span>.<span style="color:#a6e22e">div</span><span style="color:#e6db74">`
</span><span style="color:#e6db74"> height: 100%;
</span><span style="color:#e6db74"> width: 100%;
</span><span style="color:#e6db74">`</span>;
<span style="color:#a6e22e">ReactDOM</span>.<span style="color:#a6e22e">render</span>(
&lt;<span style="color:#f92672">React.StrictMode</span>&gt;
&lt;<span style="color:#f92672">App</span> /&gt;
&lt;/<span style="color:#f92672">React.StrictMode</span>&gt;,
document.<span style="color:#a6e22e">getElementById</span>(<span style="color:#e6db74">&#34;root&#34;</span>)
);
</code></pre></div><p>
<a href="/docs/guides/vote_poll_sdk/poll_sdk/01_create_dapp/" class="book-btn">
Back
</a>
<a href="/docs/guides/vote_poll_sdk/poll_sdk/03_create-a-poll_button/" class="book-btn">
Next: Create-A-Poll Button
</a>
</p>
</article>
<footer class="book-footer">
<div class="flex flex-wrap justify-between">
<div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/41bc0a9d8058006de8bf56562b5ac5e50ab00a2f" title='Last modified by Franck R | Jan 24, 2022' target="_blank" rel="noopener">
<img src="/svg/calendar.svg" class="book-icon" alt="Calendar" />
<span>Jan 24, 2022</span>
</a>
</div>
<div>
<a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/edit/develop/content/docs/guides/vote_poll_sdk/poll_sdk/02_connect_wallet.md" target="_blank" rel="noopener">
<img src="/svg/edit.svg" class="book-icon" alt="Edit" />
<span>Edit this page</span>
</a>
</div>
</div>
<script>(function(){function a(c){const a=window.getSelection(),b=document.createRange();b.selectNodeContents(c),a.removeAllRanges(),a.addRange(b)}document.querySelectorAll("pre code").forEach(b=>{b.addEventListener("click",function(c){a(b.parentElement),navigator.clipboard&&navigator.clipboard.writeText(b.parentElement.textContent)})})})()</script>
</footer>
<div class="book-comments">
</div>
<label for="menu-control" class="hidden book-menu-overlay"></label>
</div>
<aside class="book-toc">
<div class="book-toc-content">
<nav id="TableOfContents">
<ul>
<li><a href="#connect-to-the-ethereum-wallet">Connect to the Ethereum Wallet</a>
<ul>
<li><a href="#top-bar">Top bar</a></li>
<li><a href="#page">Page</a>
<ul>
<li><a href="#usedapp">UseDApp</a></li>
<li><a href="#styled-components">Styled-components</a></li>
<li><a href="#render">Render</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>
</div>
</aside>
</main>
</body>
</html>

View File

@ -21,7 +21,7 @@ useWakuPolling takes:
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -192,6 +192,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -0,0 +1,752 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Create-A-Poll Button # Create the Poll component. It will allow the user to create a new poll, view polls and answer them. We&rsquo;ll start by adding a button to create a poll.
mkdir components touch components/Poll.tsx Styled-components # Again, create a Wrapper for styling:
import styled from &#34;styled-components&#34;; const Wrapper = styled.div` display: flex; flex-direction: column; align-items: center; max-width: 1146px; position: relative; margin: 0 auto; padding: 150px 32px 50px; width: 100%; @media (max-width: 1146px) { max-width: 780px; } @media (max-width: 600px) { padding: 132px 16px 32px; } @media (max-width: 425px) { padding: 96px 16px 84px; } `; Button # Create a button that will display the PollCreation component on click.">
<meta name="theme-color" content="#FFFFFF">
<meta name="color-scheme" content="light dark"><meta property="og:title" content="Create-A-Poll Button" />
<meta property="og:description" content="Create-A-Poll Button # Create the Poll component. It will allow the user to create a new poll, view polls and answer them. We&rsquo;ll start by adding a button to create a poll.
mkdir components touch components/Poll.tsx Styled-components # Again, create a Wrapper for styling:
import styled from &#34;styled-components&#34;; const Wrapper = styled.div` display: flex; flex-direction: column; align-items: center; max-width: 1146px; position: relative; margin: 0 auto; padding: 150px 32px 50px; width: 100%; @media (max-width: 1146px) { max-width: 780px; } @media (max-width: 600px) { padding: 132px 16px 32px; } @media (max-width: 425px) { padding: 96px 16px 84px; } `; Button # Create a button that will display the PollCreation component on click." />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/03_create-a-poll_button/" /><meta property="article:section" content="docs" />
<meta property="article:published_time" content="2022-01-03T11:00:00+11:00" />
<meta property="article:modified_time" content="2022-01-24T12:17:00+11:00" />
<title>Create-A-Poll Button | Waku Connect Docs</title>
<link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.529c80d1e911ec8f549a29bff1dd2c31fc706122b64f877c8a14e63ba53421c7.js" integrity="sha256-UpyA0ekR7I9Umim/8d0sMfxwYSK2T4d8ihTmO6U0Icc=" crossorigin="anonymous"></script>
<!--
Made with Book Theme
https://github.com/alex-shpak/hugo-book
-->
</head>
<body dir="ltr">
<input type="checkbox" class="hidden toggle" id="menu-control" />
<input type="checkbox" class="hidden toggle" id="toc-control" />
<main class="container flex">
<aside class="book-menu">
<div class="book-menu-content">
<nav>
<h2 class="book-brand">
<a class="flex align-center" href="/"><span>Waku Connect Docs</span>
</a>
</h2>
<div class="book-search">
<input type="text" id="book-search-input" placeholder="Search" aria-label="Search" maxlength="64" data-hotkeys="s/" />
<div class="book-search-spinner hidden"></div>
<ul id="book-search-results"></ul>
</div>
<ul class="book-languages">
<li>
<input type="checkbox" id="languages" class="toggle" />
<label for="languages" class="flex justify-between">
<a role="button" class="flex align-center">
<img src="/svg/translate.svg" class="book-icon" alt="Languages" />
English
</a>
</label>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/es/">
Español
</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/pt/">
Português
</a>
</li>
</ul>
</li>
</ul>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/introduction/" class="">Introduction</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/quick_start/" class="">Quick Start</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/use_cases/" class="">Use Cases</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/presentations/" class="">Presentations &amp; Videos</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/" class="">Guides</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/01_choose_content_topic/" class="">How to Choose a Content Topic</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/03_store_retrieve_messages/" class="">Retrieve Messages Using Waku Store</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/04_encrypt_messages_version_1/" class="">Encrypt Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/05_sign_messages_version_1/" class="">Sign Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/06_light_push_send_messages/" class="">Send Messages Using Waku Light Push</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/07_reactjs_relay/" class="">Receive and Send Messages Using Waku Relay With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/08_reactjs_store/" class="">Retrieve Messages Using Waku Store With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/09_debug/" class="">How to Debug your Waku dApp</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/" class="">Vote Poll Sdk</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/" class="">Poll SDK</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/01_create_dapp/" class="">Create the DApp and Install Dependencies</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/02_connect_wallet/" class="">Connect to the Ethereum Wallet</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/03_create-a-poll_button/" class=" active">Create-A-Poll Button</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/04_poll_creation/" class="">Poll Creation Component</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/05_poll_list/" class="">Poll List Component</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/examples/" class="">Examples</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/crypto_libraries/" class="">Cryptographic Libraries</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/waku_protocols/" class="">Implemented Waku Protocols</a>
</li>
</ul>
<ul>
<li>
<a href="https://js-waku.wakuconnect.dev/" target="_blank" rel="noopener">
JS-Waku API Doc
</a>
</li>
<li>
<a href="https://vac.dev/" target="_blank" rel="noopener">
Vac Team
</a>
</li>
<li>
<a href="https://rfc.vac.dev/" target="_blank" rel="noopener">
Vac RFCs
</a>
</li>
<li>
<a href="https://status.im/" target="_blank" rel="noopener">
Status.im
</a>
</li>
</ul>
</nav>
<script>(function(){var a=document.querySelector("aside .book-menu-content");addEventListener("beforeunload",function(b){localStorage.setItem("menu.scrollTop",a.scrollTop)}),a.scrollTop=localStorage.getItem("menu.scrollTop")})()</script>
</div>
</aside>
<div class="book-page">
<header class="book-header">
<div class="flex align-center justify-between">
<label for="menu-control">
<img src="/svg/menu.svg" class="book-icon" alt="Menu" />
</label>
<strong>Create-A-Poll Button</strong>
<label for="toc-control">
<img src="/svg/toc.svg" class="book-icon" alt="Table of Contents" />
</label>
</div>
<aside class="hidden clearfix">
<nav id="TableOfContents">
<ul>
<li><a href="#create-a-poll-button">Create-A-Poll Button</a>
<ul>
<li><a href="#styled-components">Styled-components</a></li>
<li><a href="#button">Button</a></li>
</ul>
</li>
</ul>
</nav>
</aside>
</header>
<article class="markdown"><h1 id="create-a-poll-button">
Create-A-Poll Button
<a class="anchor" href="#create-a-poll-button">#</a>
</h1>
<p>Create the <code>Poll</code> component.
It will allow the user to create a new poll, view polls and answer them.
We&rsquo;ll start by adding a button to create a poll.</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-shell" data-lang="shell">mkdir components
touch components/Poll.tsx
</code></pre></div><h2 id="styled-components">
Styled-components
<a class="anchor" href="#styled-components">#</a>
</h2>
<p>Again, create a <code>Wrapper</code> for styling:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-tsx" data-lang="tsx"><span style="color:#66d9ef">import</span> <span style="color:#a6e22e">styled</span> <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;styled-components&#34;</span>;
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">Wrapper</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">styled</span>.<span style="color:#a6e22e">div</span><span style="color:#e6db74">`
</span><span style="color:#e6db74"> display: flex;
</span><span style="color:#e6db74"> flex-direction: column;
</span><span style="color:#e6db74"> align-items: center;
</span><span style="color:#e6db74"> max-width: 1146px;
</span><span style="color:#e6db74"> position: relative;
</span><span style="color:#e6db74"> margin: 0 auto;
</span><span style="color:#e6db74"> padding: 150px 32px 50px;
</span><span style="color:#e6db74"> width: 100%;
</span><span style="color:#e6db74"> @media (max-width: 1146px) {
</span><span style="color:#e6db74"> max-width: 780px;
</span><span style="color:#e6db74"> }
</span><span style="color:#e6db74"> @media (max-width: 600px) {
</span><span style="color:#e6db74"> padding: 132px 16px 32px;
</span><span style="color:#e6db74"> }
</span><span style="color:#e6db74"> @media (max-width: 425px) {
</span><span style="color:#e6db74"> padding: 96px 16px 84px;
</span><span style="color:#e6db74"> }
</span><span style="color:#e6db74">`</span>;
</code></pre></div><h2 id="button">
Button
<a class="anchor" href="#button">#</a>
</h2>
<p>Create a button that will display the <code>PollCreation</code> component on click.
To create a poll, we need access to the wallet,
thus the button must be disabled if the wallet is not connected.</p>
<p>The button is disabled if <code>signer</code> is undefined.
To give a visual clue to the user, also make the button grey when disabled.</p>
<p>Upon clicking the button, we set <code>showPollCreation</code> to true.
<code>showPollCreation</code> will control when to render the poll creation modal.</p>
<p><code>components/Poll.tsx</code>:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-tsx" data-lang="tsx"><span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">useState</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;react&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">JsonRpcSigner</span>, <span style="color:#a6e22e">Web3Provider</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@ethersproject/providers&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">CreateButton</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@waku/vote-poll-sdk-react-components&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">Theme</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@waku/vote-poll-sdk-react-components/dist/esm/src/style/themes&#34;</span>;
<span style="color:#66d9ef">type</span> <span style="color:#a6e22e">PollProps</span> <span style="color:#f92672">=</span> {
<span style="color:#a6e22e">signer</span>: <span style="color:#66d9ef">JsonRpcSigner</span> <span style="color:#f92672">|</span> <span style="color:#66d9ef">undefined</span>;
<span style="color:#a6e22e">theme</span>: <span style="color:#66d9ef">Theme</span>;
};
<span style="color:#66d9ef">export</span> <span style="color:#66d9ef">function</span> <span style="color:#a6e22e">Poll</span>({ <span style="color:#a6e22e">signer</span>, <span style="color:#a6e22e">theme</span> }<span style="color:#f92672">:</span> <span style="color:#a6e22e">PollProps</span>) {
<span style="color:#66d9ef">const</span> [<span style="color:#a6e22e">showPollCreation</span>, <span style="color:#a6e22e">setShowPollCreation</span>] <span style="color:#f92672">=</span> <span style="color:#a6e22e">useState</span>(<span style="color:#66d9ef">false</span>);
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">disabled</span> <span style="color:#f92672">=</span> <span style="color:#f92672">!</span><span style="color:#a6e22e">signer</span>;
<span style="color:#66d9ef">return</span> (
&lt;<span style="color:#f92672">Wrapper</span>&gt;
{
&lt;<span style="color:#f92672">CreateButton</span>
<span style="color:#a6e22e">style</span><span style="color:#f92672">=</span>{{
<span style="color:#a6e22e">backgroundColor</span>: <span style="color:#66d9ef">disabled</span> <span style="color:#f92672">?</span> <span style="color:#e6db74">&#34;lightgrey&#34;</span> <span style="color:#f92672">:</span> <span style="color:#a6e22e">theme</span>.<span style="color:#a6e22e">primaryColor</span>,
}}
<span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">theme</span>}
<span style="color:#a6e22e">disabled</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">disabled</span>}
<span style="color:#a6e22e">onClick</span><span style="color:#f92672">=</span>{() <span style="color:#f92672">=&gt;</span> <span style="color:#a6e22e">setShowPollCreation</span>(<span style="color:#66d9ef">true</span>)}
&gt;
<span style="color:#a6e22e">Create</span> <span style="color:#a6e22e">a</span> <span style="color:#a6e22e">poll</span>
&lt;/<span style="color:#f92672">CreateButton</span>&gt;
}
&lt;/<span style="color:#f92672">Wrapper</span>&gt;
);
}
</code></pre></div><p>Now update the <code>PollPage</code> component to render the new <code>Poll</code> component:</p>
<p><code>index.tsx</code>:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-tsx" data-lang="tsx"><span style="color:#66d9ef">export</span> <span style="color:#66d9ef">function</span> <span style="color:#a6e22e">PollPage() {</span>
<span style="color:#66d9ef">const</span> { <span style="color:#a6e22e">account</span>, <span style="color:#a6e22e">library</span>, <span style="color:#a6e22e">activateBrowserWallet</span>, <span style="color:#a6e22e">deactivate</span> } <span style="color:#f92672">=</span> <span style="color:#a6e22e">useEthers</span>();
<span style="color:#66d9ef">const</span> [<span style="color:#a6e22e">signer</span>, <span style="color:#a6e22e">setSigner</span>] <span style="color:#f92672">=</span> <span style="color:#a6e22e">useState</span>&lt;<span style="color:#f92672">undefined</span> <span style="color:#960050;background-color:#1e0010">|</span> <span style="color:#a6e22e">JsonRpcSigner</span>&gt;(<span style="color:#66d9ef">undefined</span>);
<span style="color:#a6e22e">useEffect</span>(() <span style="color:#f92672">=&gt;</span> {
<span style="color:#66d9ef">if</span> (<span style="color:#a6e22e">account</span>) {
<span style="color:#a6e22e">setSigner</span>(<span style="color:#a6e22e">library</span><span style="color:#f92672">?</span>.<span style="color:#a6e22e">getSigner</span>());
} <span style="color:#66d9ef">else</span> {
<span style="color:#75715e">// Deactivate signer if signed out
</span><span style="color:#75715e"></span> <span style="color:#a6e22e">setSigner</span>(<span style="color:#66d9ef">undefined</span>);
}
}, [<span style="color:#a6e22e">account</span>]);
<span style="color:#66d9ef">return</span> (
&lt;<span style="color:#f92672">div</span>&gt;
&lt;<span style="color:#f92672">TopBar</span>
<span style="color:#a6e22e">logo</span><span style="color:#f92672">=</span>{<span style="color:#e6db74">&#34;&#34;</span>}
<span style="color:#a6e22e">logoWidth</span><span style="color:#f92672">=</span>{<span style="color:#ae81ff">84</span>}
<span style="color:#a6e22e">title</span><span style="color:#f92672">=</span>{<span style="color:#e6db74">&#34;Poll dApp&#34;</span>}
<span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">orangeTheme</span>}
<span style="color:#a6e22e">activate</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">activateBrowserWallet</span>}
<span style="color:#a6e22e">account</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">account</span>}
<span style="color:#a6e22e">deactivate</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">deactivate</span>}
/&gt;
&lt;<span style="color:#f92672">Poll</span> <span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">orangeTheme</span>} <span style="color:#a6e22e">signer</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">signer</span>} /&gt;
&lt;/<span style="color:#f92672">div</span>&gt;
);
}
</code></pre></div><p>Now, you have a button:</p>
<p><img src="/assets/poll_sdk/create-poll-button.png" alt="Create a poll button" /></p>
<p>
<a href="/docs/guides/vote_poll_sdk/poll_sdk/02_connect_wallet/" class="book-btn">
Back
</a>
<a href="/docs/guides/vote_poll_sdk/poll_sdk/04_poll_creation/" class="book-btn">
Next: Poll Creation Component
</a>
</p>
</article>
<footer class="book-footer">
<div class="flex flex-wrap justify-between">
<div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/41bc0a9d8058006de8bf56562b5ac5e50ab00a2f" title='Last modified by Franck R | Jan 24, 2022' target="_blank" rel="noopener">
<img src="/svg/calendar.svg" class="book-icon" alt="Calendar" />
<span>Jan 24, 2022</span>
</a>
</div>
<div>
<a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/edit/develop/content/docs/guides/vote_poll_sdk/poll_sdk/03_create-a-poll_button.md" target="_blank" rel="noopener">
<img src="/svg/edit.svg" class="book-icon" alt="Edit" />
<span>Edit this page</span>
</a>
</div>
</div>
<script>(function(){function a(c){const a=window.getSelection(),b=document.createRange();b.selectNodeContents(c),a.removeAllRanges(),a.addRange(b)}document.querySelectorAll("pre code").forEach(b=>{b.addEventListener("click",function(c){a(b.parentElement),navigator.clipboard&&navigator.clipboard.writeText(b.parentElement.textContent)})})})()</script>
</footer>
<div class="book-comments">
</div>
<label for="menu-control" class="hidden book-menu-overlay"></label>
</div>
<aside class="book-toc">
<div class="book-toc-content">
<nav id="TableOfContents">
<ul>
<li><a href="#create-a-poll-button">Create-A-Poll Button</a>
<ul>
<li><a href="#styled-components">Styled-components</a></li>
<li><a href="#button">Button</a></li>
</ul>
</li>
</ul>
</nav>
</div>
</aside>
</main>
</body>
</html>

View File

@ -23,7 +23,7 @@ import React, { useMemo, useState } from &#34;react&#34;; import styled from &#3
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -194,6 +194,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -0,0 +1,753 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Poll Creation Component # The Poll SDK provides an off-the-shelf component to create a new poll: PollCreation. It takes in a WakuPolling hook that can created with useWakuPolling.
useWakuPolling takes:
appName: Your app name. It is used to generate a unique content topic for your polls. See How to Choose a Content Topic for more information. tokenAddress: The address of your ERC-20 token. Only token holders can create and answer polls.">
<meta name="theme-color" content="#FFFFFF">
<meta name="color-scheme" content="light dark"><meta property="og:title" content="Poll Creation Component" />
<meta property="og:description" content="Poll Creation Component # The Poll SDK provides an off-the-shelf component to create a new poll: PollCreation. It takes in a WakuPolling hook that can created with useWakuPolling.
useWakuPolling takes:
appName: Your app name. It is used to generate a unique content topic for your polls. See How to Choose a Content Topic for more information. tokenAddress: The address of your ERC-20 token. Only token holders can create and answer polls." />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/04_poll_creation/" /><meta property="article:section" content="docs" />
<meta property="article:published_time" content="2022-01-03T11:00:00+11:00" />
<meta property="article:modified_time" content="2022-01-24T12:17:00+11:00" />
<title>Poll Creation Component | Waku Connect Docs</title>
<link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.529c80d1e911ec8f549a29bff1dd2c31fc706122b64f877c8a14e63ba53421c7.js" integrity="sha256-UpyA0ekR7I9Umim/8d0sMfxwYSK2T4d8ihTmO6U0Icc=" crossorigin="anonymous"></script>
<!--
Made with Book Theme
https://github.com/alex-shpak/hugo-book
-->
</head>
<body dir="ltr">
<input type="checkbox" class="hidden toggle" id="menu-control" />
<input type="checkbox" class="hidden toggle" id="toc-control" />
<main class="container flex">
<aside class="book-menu">
<div class="book-menu-content">
<nav>
<h2 class="book-brand">
<a class="flex align-center" href="/"><span>Waku Connect Docs</span>
</a>
</h2>
<div class="book-search">
<input type="text" id="book-search-input" placeholder="Search" aria-label="Search" maxlength="64" data-hotkeys="s/" />
<div class="book-search-spinner hidden"></div>
<ul id="book-search-results"></ul>
</div>
<ul class="book-languages">
<li>
<input type="checkbox" id="languages" class="toggle" />
<label for="languages" class="flex justify-between">
<a role="button" class="flex align-center">
<img src="/svg/translate.svg" class="book-icon" alt="Languages" />
English
</a>
</label>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/es/">
Español
</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/pt/">
Português
</a>
</li>
</ul>
</li>
</ul>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/introduction/" class="">Introduction</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/quick_start/" class="">Quick Start</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/use_cases/" class="">Use Cases</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/presentations/" class="">Presentations &amp; Videos</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/" class="">Guides</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/01_choose_content_topic/" class="">How to Choose a Content Topic</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/03_store_retrieve_messages/" class="">Retrieve Messages Using Waku Store</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/04_encrypt_messages_version_1/" class="">Encrypt Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/05_sign_messages_version_1/" class="">Sign Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/06_light_push_send_messages/" class="">Send Messages Using Waku Light Push</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/07_reactjs_relay/" class="">Receive and Send Messages Using Waku Relay With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/08_reactjs_store/" class="">Retrieve Messages Using Waku Store With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/09_debug/" class="">How to Debug your Waku dApp</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/" class="">Vote Poll Sdk</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/" class="">Poll SDK</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/01_create_dapp/" class="">Create the DApp and Install Dependencies</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/02_connect_wallet/" class="">Connect to the Ethereum Wallet</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/03_create-a-poll_button/" class="">Create-A-Poll Button</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/04_poll_creation/" class=" active">Poll Creation Component</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/05_poll_list/" class="">Poll List Component</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/examples/" class="">Examples</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/crypto_libraries/" class="">Cryptographic Libraries</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/waku_protocols/" class="">Implemented Waku Protocols</a>
</li>
</ul>
<ul>
<li>
<a href="https://js-waku.wakuconnect.dev/" target="_blank" rel="noopener">
JS-Waku API Doc
</a>
</li>
<li>
<a href="https://vac.dev/" target="_blank" rel="noopener">
Vac Team
</a>
</li>
<li>
<a href="https://rfc.vac.dev/" target="_blank" rel="noopener">
Vac RFCs
</a>
</li>
<li>
<a href="https://status.im/" target="_blank" rel="noopener">
Status.im
</a>
</li>
</ul>
</nav>
<script>(function(){var a=document.querySelector("aside .book-menu-content");addEventListener("beforeunload",function(b){localStorage.setItem("menu.scrollTop",a.scrollTop)}),a.scrollTop=localStorage.getItem("menu.scrollTop")})()</script>
</div>
</aside>
<div class="book-page">
<header class="book-header">
<div class="flex align-center justify-between">
<label for="menu-control">
<img src="/svg/menu.svg" class="book-icon" alt="Menu" />
</label>
<strong>Poll Creation Component</strong>
<label for="toc-control">
<img src="/svg/toc.svg" class="book-icon" alt="Table of Contents" />
</label>
</div>
<aside class="hidden clearfix">
<nav id="TableOfContents">
<ul>
<li><a href="#poll-creation-component">Poll Creation Component</a></li>
</ul>
</nav>
</aside>
</header>
<article class="markdown"><h1 id="poll-creation-component">
Poll Creation Component
<a class="anchor" href="#poll-creation-component">#</a>
</h1>
<p>The Poll SDK provides an off-the-shelf component to create a new poll: <code>PollCreation</code>.
It takes in a <code>WakuPolling</code> hook that can created with <code>useWakuPolling</code>.</p>
<p><code>useWakuPolling</code> takes:</p>
<ul>
<li><code>appName</code>: Your app name.
It is used to generate a unique content topic for your polls.
See <a href="/docs/guides/01_choose_content_topic/">How to Choose a Content Topic</a> for more information.</li>
<li><code>tokenAddress</code>: The address of your ERC-20 token.
Only token holders can create and answer polls.</li>
<li><code>provider</code>: The Web3 provider to access the blockchain.</li>
<li><code>multicallAddress</code>: Address to this blockchain&rsquo;s multicall contract.</li>
</ul>
<p>Add these parameters to <code>PollProps</code> and call <code>useWakuPolling</code>.</p>
<p><code>components/Poll.tsx</code></p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-tsx" data-lang="tsx"><span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">useState</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;react&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">useConfig</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@usedapp/core&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">PollCreation</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@waku/poll-sdk-react-components&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">JsonRpcSigner</span>, <span style="color:#a6e22e">Web3Provider</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@ethersproject/providers&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">useWakuPolling</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@waku/poll-sdk-react-hooks&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">CreateButton</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@waku/vote-poll-sdk-react-components&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">Theme</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@waku/vote-poll-sdk-react-components/dist/esm/src/style/themes&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">ChainId</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@usedapp/core/src/constants&#34;</span>;
<span style="color:#66d9ef">type</span> <span style="color:#a6e22e">PollProps</span> <span style="color:#f92672">=</span> {
<span style="color:#a6e22e">appName</span>: <span style="color:#66d9ef">string</span>;
<span style="color:#a6e22e">library</span>: <span style="color:#66d9ef">Web3Provider</span> <span style="color:#f92672">|</span> <span style="color:#66d9ef">undefined</span>;
<span style="color:#a6e22e">signer</span>: <span style="color:#66d9ef">JsonRpcSigner</span> <span style="color:#f92672">|</span> <span style="color:#66d9ef">undefined</span>;
<span style="color:#a6e22e">chainId</span>: <span style="color:#66d9ef">ChainId</span> <span style="color:#f92672">|</span> <span style="color:#66d9ef">undefined</span>;
<span style="color:#a6e22e">theme</span>: <span style="color:#66d9ef">Theme</span>;
<span style="color:#a6e22e">tokenAddress</span>: <span style="color:#66d9ef">string</span>;
};
<span style="color:#66d9ef">export</span> <span style="color:#66d9ef">function</span> <span style="color:#a6e22e">Poll</span>({
<span style="color:#a6e22e">appName</span>,
<span style="color:#a6e22e">library</span>,
<span style="color:#a6e22e">signer</span>,
<span style="color:#a6e22e">chainId</span>,
<span style="color:#a6e22e">theme</span>,
<span style="color:#a6e22e">tokenAddress</span>,
}<span style="color:#f92672">:</span> <span style="color:#a6e22e">PollProps</span>) {
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">config</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">useConfig</span>();
<span style="color:#66d9ef">const</span> [<span style="color:#a6e22e">showPollCreation</span>, <span style="color:#a6e22e">setShowPollCreation</span>] <span style="color:#f92672">=</span> <span style="color:#a6e22e">useState</span>(<span style="color:#66d9ef">false</span>);
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">wakuPolling</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">useWakuPolling</span>(
<span style="color:#a6e22e">appName</span>,
<span style="color:#a6e22e">tokenAddress</span>,
<span style="color:#a6e22e">library</span>,
<span style="color:#a6e22e">config</span><span style="color:#f92672">?</span>.<span style="color:#a6e22e">multicallAddresses</span><span style="color:#f92672">?</span>.[<span style="color:#a6e22e">chainId</span> <span style="color:#f92672">??</span> <span style="color:#ae81ff">1337</span>]
);
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">disabled</span> <span style="color:#f92672">=</span> <span style="color:#f92672">!</span><span style="color:#a6e22e">signer</span>;
<span style="color:#66d9ef">return</span> (
&lt;<span style="color:#f92672">Wrapper</span>&gt;
{<span style="color:#a6e22e">showPollCreation</span> <span style="color:#f92672">&amp;&amp;</span> <span style="color:#a6e22e">signer</span> <span style="color:#f92672">&amp;&amp;</span> (
&lt;<span style="color:#f92672">PollCreation</span>
<span style="color:#a6e22e">wakuPolling</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">wakuPolling</span>}
<span style="color:#a6e22e">setShowPollCreation</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">setShowPollCreation</span>}
<span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">theme</span>}
/&gt;
)}
{
&lt;<span style="color:#f92672">CreateButton</span>
<span style="color:#a6e22e">style</span><span style="color:#f92672">=</span>{{
<span style="color:#a6e22e">backgroundColor</span>: <span style="color:#66d9ef">disabled</span> <span style="color:#f92672">?</span> <span style="color:#e6db74">&#34;lightgrey&#34;</span> <span style="color:#f92672">:</span> <span style="color:#a6e22e">theme</span>.<span style="color:#a6e22e">primaryColor</span>,
}}
<span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">theme</span>}
<span style="color:#a6e22e">disabled</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">disabled</span>}
<span style="color:#a6e22e">onClick</span><span style="color:#f92672">=</span>{() <span style="color:#f92672">=&gt;</span> <span style="color:#a6e22e">setShowPollCreation</span>(<span style="color:#66d9ef">true</span>)}
&gt;
<span style="color:#a6e22e">Create</span> <span style="color:#a6e22e">a</span> <span style="color:#a6e22e">poll</span>
&lt;/<span style="color:#f92672">CreateButton</span>&gt;
}
&lt;/<span style="color:#f92672">Wrapper</span>&gt;
);
}
</code></pre></div><p>Then pass them in <code>PollPage</code>.</p>
<p>In this example, we use <code>demo-poll-dapp</code> for the app name and the mainnet SNT token contract for the token address.
Replace those with your own.</p>
<p><code>index.tsx</code></p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-tsx" data-lang="tsx"><span style="color:#66d9ef">export</span> <span style="color:#66d9ef">function</span> <span style="color:#a6e22e">PollPage() {</span>
<span style="color:#66d9ef">const</span> { <span style="color:#a6e22e">account</span>, <span style="color:#a6e22e">library</span>, <span style="color:#a6e22e">activateBrowserWallet</span>, <span style="color:#a6e22e">deactivate</span>, <span style="color:#a6e22e">chainId</span> } <span style="color:#f92672">=</span>
<span style="color:#a6e22e">useEthers</span>();
<span style="color:#66d9ef">const</span> [<span style="color:#a6e22e">signer</span>, <span style="color:#a6e22e">setSigner</span>] <span style="color:#f92672">=</span> <span style="color:#a6e22e">useState</span>&lt;<span style="color:#f92672">undefined</span> <span style="color:#960050;background-color:#1e0010">|</span> <span style="color:#a6e22e">JsonRpcSigner</span>&gt;(<span style="color:#66d9ef">undefined</span>);
<span style="color:#a6e22e">useEffect</span>(() <span style="color:#f92672">=&gt;</span> {
<span style="color:#66d9ef">if</span> (<span style="color:#a6e22e">account</span>) {
<span style="color:#a6e22e">setSigner</span>(<span style="color:#a6e22e">library</span><span style="color:#f92672">?</span>.<span style="color:#a6e22e">getSigner</span>());
} <span style="color:#66d9ef">else</span> {
<span style="color:#75715e">// Deactivate signer if signed out
</span><span style="color:#75715e"></span> <span style="color:#a6e22e">setSigner</span>(<span style="color:#66d9ef">undefined</span>);
}
}, [<span style="color:#a6e22e">account</span>]);
<span style="color:#66d9ef">return</span> (
&lt;<span style="color:#f92672">div</span>&gt;
&lt;<span style="color:#f92672">TopBar</span>
<span style="color:#a6e22e">logo</span><span style="color:#f92672">=</span>{<span style="color:#e6db74">&#34;&#34;</span>}
<span style="color:#a6e22e">logoWidth</span><span style="color:#f92672">=</span>{<span style="color:#ae81ff">84</span>}
<span style="color:#a6e22e">title</span><span style="color:#f92672">=</span>{<span style="color:#e6db74">&#34;Poll dApp&#34;</span>}
<span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">orangeTheme</span>}
<span style="color:#a6e22e">activate</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">activateBrowserWallet</span>}
<span style="color:#a6e22e">account</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">account</span>}
<span style="color:#a6e22e">deactivate</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">deactivate</span>}
/&gt;
&lt;<span style="color:#f92672">Poll</span>
<span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">orangeTheme</span>}
<span style="color:#a6e22e">appName</span><span style="color:#f92672">=</span>{<span style="color:#e6db74">&#34;demo-poll-dapp&#34;</span>}
<span style="color:#a6e22e">library</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">library</span>}
<span style="color:#a6e22e">signer</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">signer</span>}
<span style="color:#a6e22e">chainId</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">chainId</span>}
<span style="color:#a6e22e">tokenAddress</span><span style="color:#f92672">=</span>{<span style="color:#e6db74">&#34;0x744d70FDBE2Ba4CF95131626614a1763DF805B9E&#34;</span>}
/&gt;
&lt;/<span style="color:#f92672">div</span>&gt;
);
}
</code></pre></div><p>You can now see the poll creation modal when clicking on the button:</p>
<p><img src="/assets/poll_sdk/create-a-poll-component.png" alt="Create a poll modal" /></p>
<p><img src="/assets/poll_sdk/poll-created.png" alt="Confirmation modal" /></p>
<p>
<a href="/docs/guides/vote_poll_sdk/poll_sdk/03_create-a-poll_button/" class="book-btn">
Back
</a>
<a href="/docs/guides/vote_poll_sdk/poll_sdk/05_poll_list/" class="book-btn">
Next: Poll List Component
</a>
</p>
</article>
<footer class="book-footer">
<div class="flex flex-wrap justify-between">
<div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/41bc0a9d8058006de8bf56562b5ac5e50ab00a2f" title='Last modified by Franck R | Jan 24, 2022' target="_blank" rel="noopener">
<img src="/svg/calendar.svg" class="book-icon" alt="Calendar" />
<span>Jan 24, 2022</span>
</a>
</div>
<div>
<a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/edit/develop/content/docs/guides/vote_poll_sdk/poll_sdk/04_poll_creation.md" target="_blank" rel="noopener">
<img src="/svg/edit.svg" class="book-icon" alt="Edit" />
<span>Edit this page</span>
</a>
</div>
</div>
<script>(function(){function a(c){const a=window.getSelection(),b=document.createRange();b.selectNodeContents(c),a.removeAllRanges(),a.addRange(b)}document.querySelectorAll("pre code").forEach(b=>{b.addEventListener("click",function(c){a(b.parentElement),navigator.clipboard&&navigator.clipboard.writeText(b.parentElement.textContent)})})})()</script>
</footer>
<div class="book-comments">
</div>
<label for="menu-control" class="hidden book-menu-overlay"></label>
</div>
<aside class="book-toc">
<div class="book-toc-content">
<nav id="TableOfContents">
<ul>
<li><a href="#poll-creation-component">Poll Creation Component</a></li>
</ul>
</nav>
</div>
</aside>
</main>
</body>
</html>

View File

@ -0,0 +1,718 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Poll List Component # To display existing polls, the PollList component is provided.
Simply add it to the Poll function to render it. It needs the account variable that can be passed as a property to Poll:
components/Poll.tsx:
import { useState } from &#34;react&#34;; import { useConfig } from &#34;@usedapp/core&#34;; import { PollCreation, PollList } from &#34;@waku/poll-sdk-react-components&#34;; import { JsonRpcSigner, Web3Provider } from &#34;@ethersproject/providers&#34;; import { useWakuPolling } from &#34;@waku/poll-sdk-react-hooks&#34;; import { CreateButton } from &#34;@waku/vote-poll-sdk-react-components&#34;; import { Theme } from &#34;@waku/vote-poll-sdk-react-components/dist/esm/src/style/themes&#34;; import { ChainId } from &#34;@usedapp/core/src/constants&#34;; type PollProps = { appName: string; library: Web3Provider | undefined; signer: JsonRpcSigner | undefined; chainId: ChainId | undefined; account: string | null | undefined; theme: Theme; tokenAddress: string; }; export function Poll({ appName, library, signer, chainId, account, theme, tokenAddress, }: PollProps) { const config = useConfig(); const [showPollCreation, setShowPollCreation] = useState(false); const wakuPolling = useWakuPolling( appName, tokenAddress, library, config?">
<meta name="theme-color" content="#FFFFFF">
<meta name="color-scheme" content="light dark"><meta property="og:title" content="Poll List Component" />
<meta property="og:description" content="Poll List Component # To display existing polls, the PollList component is provided.
Simply add it to the Poll function to render it. It needs the account variable that can be passed as a property to Poll:
components/Poll.tsx:
import { useState } from &#34;react&#34;; import { useConfig } from &#34;@usedapp/core&#34;; import { PollCreation, PollList } from &#34;@waku/poll-sdk-react-components&#34;; import { JsonRpcSigner, Web3Provider } from &#34;@ethersproject/providers&#34;; import { useWakuPolling } from &#34;@waku/poll-sdk-react-hooks&#34;; import { CreateButton } from &#34;@waku/vote-poll-sdk-react-components&#34;; import { Theme } from &#34;@waku/vote-poll-sdk-react-components/dist/esm/src/style/themes&#34;; import { ChainId } from &#34;@usedapp/core/src/constants&#34;; type PollProps = { appName: string; library: Web3Provider | undefined; signer: JsonRpcSigner | undefined; chainId: ChainId | undefined; account: string | null | undefined; theme: Theme; tokenAddress: string; }; export function Poll({ appName, library, signer, chainId, account, theme, tokenAddress, }: PollProps) { const config = useConfig(); const [showPollCreation, setShowPollCreation] = useState(false); const wakuPolling = useWakuPolling( appName, tokenAddress, library, config?" />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/05_poll_list/" /><meta property="article:section" content="docs" />
<meta property="article:published_time" content="2022-01-03T11:00:00+11:00" />
<meta property="article:modified_time" content="2022-01-24T12:17:00+11:00" />
<title>Poll List Component | Waku Connect Docs</title>
<link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.529c80d1e911ec8f549a29bff1dd2c31fc706122b64f877c8a14e63ba53421c7.js" integrity="sha256-UpyA0ekR7I9Umim/8d0sMfxwYSK2T4d8ihTmO6U0Icc=" crossorigin="anonymous"></script>
<!--
Made with Book Theme
https://github.com/alex-shpak/hugo-book
-->
</head>
<body dir="ltr">
<input type="checkbox" class="hidden toggle" id="menu-control" />
<input type="checkbox" class="hidden toggle" id="toc-control" />
<main class="container flex">
<aside class="book-menu">
<div class="book-menu-content">
<nav>
<h2 class="book-brand">
<a class="flex align-center" href="/"><span>Waku Connect Docs</span>
</a>
</h2>
<div class="book-search">
<input type="text" id="book-search-input" placeholder="Search" aria-label="Search" maxlength="64" data-hotkeys="s/" />
<div class="book-search-spinner hidden"></div>
<ul id="book-search-results"></ul>
</div>
<ul class="book-languages">
<li>
<input type="checkbox" id="languages" class="toggle" />
<label for="languages" class="flex justify-between">
<a role="button" class="flex align-center">
<img src="/svg/translate.svg" class="book-icon" alt="Languages" />
English
</a>
</label>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/es/">
Español
</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/pt/">
Português
</a>
</li>
</ul>
</li>
</ul>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/introduction/" class="">Introduction</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/quick_start/" class="">Quick Start</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/use_cases/" class="">Use Cases</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/presentations/" class="">Presentations &amp; Videos</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/" class="">Guides</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/01_choose_content_topic/" class="">How to Choose a Content Topic</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/03_store_retrieve_messages/" class="">Retrieve Messages Using Waku Store</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/04_encrypt_messages_version_1/" class="">Encrypt Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/05_sign_messages_version_1/" class="">Sign Messages Using Waku Message Version 1</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/06_light_push_send_messages/" class="">Send Messages Using Waku Light Push</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/07_reactjs_relay/" class="">Receive and Send Messages Using Waku Relay With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/08_reactjs_store/" class="">Retrieve Messages Using Waku Store With ReactJS</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/09_debug/" class="">How to Debug your Waku dApp</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/" class="">Vote Poll Sdk</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/" class="">Poll SDK</a>
<ul>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/01_create_dapp/" class="">Create the DApp and Install Dependencies</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/02_connect_wallet/" class="">Connect to the Ethereum Wallet</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/03_create-a-poll_button/" class="">Create-A-Poll Button</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/04_poll_creation/" class="">Poll Creation Component</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/05_poll_list/" class=" active">Poll List Component</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/examples/" class="">Examples</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/crypto_libraries/" class="">Cryptographic Libraries</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/waku_protocols/" class="">Implemented Waku Protocols</a>
</li>
</ul>
<ul>
<li>
<a href="https://js-waku.wakuconnect.dev/" target="_blank" rel="noopener">
JS-Waku API Doc
</a>
</li>
<li>
<a href="https://vac.dev/" target="_blank" rel="noopener">
Vac Team
</a>
</li>
<li>
<a href="https://rfc.vac.dev/" target="_blank" rel="noopener">
Vac RFCs
</a>
</li>
<li>
<a href="https://status.im/" target="_blank" rel="noopener">
Status.im
</a>
</li>
</ul>
</nav>
<script>(function(){var a=document.querySelector("aside .book-menu-content");addEventListener("beforeunload",function(b){localStorage.setItem("menu.scrollTop",a.scrollTop)}),a.scrollTop=localStorage.getItem("menu.scrollTop")})()</script>
</div>
</aside>
<div class="book-page">
<header class="book-header">
<div class="flex align-center justify-between">
<label for="menu-control">
<img src="/svg/menu.svg" class="book-icon" alt="Menu" />
</label>
<strong>Poll List Component</strong>
<label for="toc-control">
<img src="/svg/toc.svg" class="book-icon" alt="Table of Contents" />
</label>
</div>
<aside class="hidden clearfix">
<nav id="TableOfContents">
<ul>
<li><a href="#poll-list-component">Poll List Component</a></li>
</ul>
</nav>
</aside>
</header>
<article class="markdown"><h1 id="poll-list-component">
Poll List Component
<a class="anchor" href="#poll-list-component">#</a>
</h1>
<p>To display existing polls, the <code>PollList</code> component is provided.</p>
<p>Simply add it to the <code>Poll</code> function to render it.
It needs the <code>account</code> variable that can be passed as a property to <code>Poll</code>:</p>
<p><code>components/Poll.tsx</code>:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-tsx" data-lang="tsx"><span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">useState</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;react&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">useConfig</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@usedapp/core&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">PollCreation</span>, <span style="color:#a6e22e">PollList</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@waku/poll-sdk-react-components&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">JsonRpcSigner</span>, <span style="color:#a6e22e">Web3Provider</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@ethersproject/providers&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">useWakuPolling</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@waku/poll-sdk-react-hooks&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">CreateButton</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@waku/vote-poll-sdk-react-components&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">Theme</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@waku/vote-poll-sdk-react-components/dist/esm/src/style/themes&#34;</span>;
<span style="color:#66d9ef">import</span> { <span style="color:#a6e22e">ChainId</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#34;@usedapp/core/src/constants&#34;</span>;
<span style="color:#66d9ef">type</span> <span style="color:#a6e22e">PollProps</span> <span style="color:#f92672">=</span> {
<span style="color:#a6e22e">appName</span>: <span style="color:#66d9ef">string</span>;
<span style="color:#a6e22e">library</span>: <span style="color:#66d9ef">Web3Provider</span> <span style="color:#f92672">|</span> <span style="color:#66d9ef">undefined</span>;
<span style="color:#a6e22e">signer</span>: <span style="color:#66d9ef">JsonRpcSigner</span> <span style="color:#f92672">|</span> <span style="color:#66d9ef">undefined</span>;
<span style="color:#a6e22e">chainId</span>: <span style="color:#66d9ef">ChainId</span> <span style="color:#f92672">|</span> <span style="color:#66d9ef">undefined</span>;
<span style="color:#a6e22e">account</span>: <span style="color:#66d9ef">string</span> <span style="color:#f92672">|</span> <span style="color:#66d9ef">null</span> <span style="color:#f92672">|</span> <span style="color:#66d9ef">undefined</span>;
<span style="color:#a6e22e">theme</span>: <span style="color:#66d9ef">Theme</span>;
<span style="color:#a6e22e">tokenAddress</span>: <span style="color:#66d9ef">string</span>;
};
<span style="color:#66d9ef">export</span> <span style="color:#66d9ef">function</span> <span style="color:#a6e22e">Poll</span>({
<span style="color:#a6e22e">appName</span>,
<span style="color:#a6e22e">library</span>,
<span style="color:#a6e22e">signer</span>,
<span style="color:#a6e22e">chainId</span>,
<span style="color:#a6e22e">account</span>,
<span style="color:#a6e22e">theme</span>,
<span style="color:#a6e22e">tokenAddress</span>,
}<span style="color:#f92672">:</span> <span style="color:#a6e22e">PollProps</span>) {
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">config</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">useConfig</span>();
<span style="color:#66d9ef">const</span> [<span style="color:#a6e22e">showPollCreation</span>, <span style="color:#a6e22e">setShowPollCreation</span>] <span style="color:#f92672">=</span> <span style="color:#a6e22e">useState</span>(<span style="color:#66d9ef">false</span>);
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">wakuPolling</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">useWakuPolling</span>(
<span style="color:#a6e22e">appName</span>,
<span style="color:#a6e22e">tokenAddress</span>,
<span style="color:#a6e22e">library</span>,
<span style="color:#a6e22e">config</span><span style="color:#f92672">?</span>.<span style="color:#a6e22e">multicallAddresses</span><span style="color:#f92672">?</span>.[<span style="color:#a6e22e">chainId</span> <span style="color:#f92672">??</span> <span style="color:#ae81ff">1337</span>]
);
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">disabled</span> <span style="color:#f92672">=</span> <span style="color:#f92672">!</span><span style="color:#a6e22e">signer</span>;
<span style="color:#66d9ef">return</span> (
&lt;<span style="color:#f92672">Wrapper</span>&gt;
{<span style="color:#a6e22e">showPollCreation</span> <span style="color:#f92672">&amp;&amp;</span> <span style="color:#a6e22e">signer</span> <span style="color:#f92672">&amp;&amp;</span> (
&lt;<span style="color:#f92672">PollCreation</span>
<span style="color:#a6e22e">wakuPolling</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">wakuPolling</span>}
<span style="color:#a6e22e">setShowPollCreation</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">setShowPollCreation</span>}
<span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">theme</span>}
/&gt;
)}
{
&lt;<span style="color:#f92672">CreateButton</span>
<span style="color:#a6e22e">style</span><span style="color:#f92672">=</span>{{
<span style="color:#a6e22e">backgroundColor</span>: <span style="color:#66d9ef">disabled</span> <span style="color:#f92672">?</span> <span style="color:#e6db74">&#34;lightgrey&#34;</span> <span style="color:#f92672">:</span> <span style="color:#a6e22e">theme</span>.<span style="color:#a6e22e">primaryColor</span>,
}}
<span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">theme</span>}
<span style="color:#a6e22e">disabled</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">disabled</span>}
<span style="color:#a6e22e">onClick</span><span style="color:#f92672">=</span>{() <span style="color:#f92672">=&gt;</span> <span style="color:#a6e22e">setShowPollCreation</span>(<span style="color:#66d9ef">true</span>)}
&gt;
<span style="color:#a6e22e">Create</span> <span style="color:#a6e22e">a</span> <span style="color:#a6e22e">poll</span>
&lt;/<span style="color:#f92672">CreateButton</span>&gt;
}
&lt;<span style="color:#f92672">PollList</span> <span style="color:#a6e22e">wakuPolling</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">wakuPolling</span>} <span style="color:#a6e22e">account</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">account</span>} <span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">theme</span>} /&gt;
&lt;/<span style="color:#f92672">Wrapper</span>&gt;
);
}
</code></pre></div><p>Pass the <code>account</code> to <code>Poll</code> in <code>index.tsx</code>:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-tsx" data-lang="tsx">&lt;<span style="color:#f92672">Poll</span>
<span style="color:#a6e22e">theme</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">orangeTheme</span>}
<span style="color:#a6e22e">appName</span><span style="color:#f92672">=</span>{<span style="color:#e6db74">&#34;demo-poll-dapp&#34;</span>}
<span style="color:#a6e22e">library</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">library</span>}
<span style="color:#a6e22e">signer</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">signer</span>}
<span style="color:#a6e22e">chainId</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">chainId</span>}
<span style="color:#a6e22e">account</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">account</span>}
<span style="color:#a6e22e">tokenAddress</span><span style="color:#f92672">=</span>{<span style="color:#e6db74">&#34;0x744d70FDBE2Ba4CF95131626614a1763DF805B9E&#34;</span>}
/&gt;
</code></pre></div><p>Et voila!
The <code>PollList</code> component handles the display of polls:</p>
<p><img src="/assets/poll_sdk/listed-polls.png" alt="Poll List" /></p>
<p>And answering them:</p>
<p><img src="/assets/poll_sdk/listed-polls-with-answer.png" alt="Poll list with answered" /></p>
<p>You can find the resulting code in the <a href="https://github.com/status-im/wakuconnect-vote-poll-sdk/tree/main/examples/mainnet-poll">examples folder</a>.</p>
<blockquote class="book-hint info">
The example above uses webpack 5 instead of react-app-rewired.
It also allows passing a token contract address in the url, as described in the <a href="https://github.com/status-im/wakuconnect-vote-poll-sdk/blob/main/examples/mainnet-poll/README.md">README</a>.
</blockquote>
<p>The final gif:</p>
<p><img src="/assets/poll_sdk/wakuconnect-poll-demo.gif" alt="Poll demo" /></p>
<a href="/docs/guides/vote_poll_sdk/poll_sdk/04_poll_creation/" class="book-btn">
Back
</a>
</article>
<footer class="book-footer">
<div class="flex flex-wrap justify-between">
<div><a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/commit/41bc0a9d8058006de8bf56562b5ac5e50ab00a2f" title='Last modified by Franck R | Jan 24, 2022' target="_blank" rel="noopener">
<img src="/svg/calendar.svg" class="book-icon" alt="Calendar" />
<span>Jan 24, 2022</span>
</a>
</div>
<div>
<a class="flex align-center" href="https://github.com/vacp2p/docs.wakuconnect.dev/edit/develop/content/docs/guides/vote_poll_sdk/poll_sdk/05_poll_list.md" target="_blank" rel="noopener">
<img src="/svg/edit.svg" class="book-icon" alt="Edit" />
<span>Edit this page</span>
</a>
</div>
</div>
<script>(function(){function a(c){const a=window.getSelection(),b=document.createRange();b.selectNodeContents(c),a.removeAllRanges(),a.addRange(b)}document.querySelectorAll("pre code").forEach(b=>{b.addEventListener("click",function(c){a(b.parentElement),navigator.clipboard&&navigator.clipboard.writeText(b.parentElement.textContent)})})})()</script>
</footer>
<div class="book-comments">
</div>
<label for="menu-control" class="hidden book-menu-overlay"></label>
</div>
<aside class="book-toc">
<div class="book-toc-content">
<nav id="TableOfContents">
<ul>
<li><a href="#poll-list-component">Poll List Component</a></li>
</ul>
</nav>
</div>
</aside>
</main>
</body>
</html>

View File

@ -18,7 +18,7 @@ The resulting code of this guide can be found at https://github.">
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/index.xml" title="Waku Connect Docs" /> <link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/poll_sdk/index.xml" title="Waku Connect Docs" />
<!-- <!--
Made with Book Theme Made with Book Theme
@ -190,6 +190,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -23,7 +23,7 @@ import { ContractFactory, getDefaultProvider, Wallet } from &#34;ethers&#34;; im
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -194,6 +194,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -23,7 +23,7 @@ After that we can start with styling and defining which theme we will be using:"
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -194,6 +194,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -21,7 +21,7 @@ import { useWakuVoting } from &#34;@waku/vote-sdk-react-hooks&#34;; export funct
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -192,6 +192,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -18,7 +18,7 @@ The resulting code of this guide can be found in the repo at examples/ropsten-vo
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/vote_sdk/index.xml" title="Waku Connect Docs" /> <link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/vote_sdk/index.xml" title="Waku Connect Docs" />
<!-- <!--
Made with Book Theme Made with Book Theme
@ -190,6 +190,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -19,7 +19,7 @@ Waku can be used for chat purposes and for many machine-to-machine use cases.">
<link rel="alternate" hreflang="pt" href="https://docs.wakuconnect.dev/pt/docs/" title="Introdução"> <link rel="alternate" hreflang="pt" href="https://docs.wakuconnect.dev/pt/docs/" title="Introdução">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/docs/index.xml" title="Waku Connect Docs" /> <link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/docs/index.xml" title="Waku Connect Docs" />
<!-- <!--
Made with Book Theme Made with Book Theme
@ -195,6 +195,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -21,7 +21,7 @@ Waku can be used for chat purposes and for many machine-to-machine use cases." /
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -192,6 +192,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -27,7 +27,7 @@
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -198,6 +198,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -23,7 +23,7 @@ npm install js-waku # or with yarn yarn add js-waku Start a waku node # import
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -194,6 +194,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -25,7 +25,7 @@ Legend:
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -196,6 +196,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -19,7 +19,7 @@
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<!-- <!--
Made with Book Theme Made with Book Theme
https://github.com/alex-shpak/hugo-book https://github.com/alex-shpak/hugo-book
@ -190,6 +190,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
'use strict';(function(){const g='/en.search-data.min.ef4fc92cae7a71c272a5a121e620906d075d6e074dadd0a53776e15e9c11b23a.json',h=Object.assign({cache:!0},{doc:{id:'id',field:['title','content'],store:['title','href','section']}}),a=document.querySelector('#book-search-input'),b=document.querySelector('#book-search-results');if(!a)return;a.addEventListener('focus',c),a.addEventListener('keyup',d),document.addEventListener('keypress',e);function e(b){if(b.target.value!==void 0)return;if(a===document.activeElement)return;const c=String.fromCharCode(b.charCode);if(!f(c))return;a.focus(),b.preventDefault()}function f(b){const c=a.getAttribute('data-hotkeys')||'';return c.indexOf(b)>=0}function c(){a.removeEventListener('focus',c),a.required=!0,fetch(g).then(a=>a.json()).then(a=>{window.bookSearchIndex=FlexSearch.create('balance',h),window.bookSearchIndex.add(a)}).then(()=>a.required=!1).then(d)}function d(){while(b.firstChild)b.removeChild(b.firstChild);if(!a.value)return;const c=window.bookSearchIndex.search(a.value,10);c.forEach(function(a){const c=i('<li><a href></a><small></small></li>'),d=c.querySelector('a'),e=c.querySelector('small');d.href=a.href,d.textContent=a.title,e.textContent=a.section,b.appendChild(c)})}function i(b){const a=document.createElement('div');return a.innerHTML=b,a.firstChild}})() 'use strict';(function(){const g='/en.search-data.min.539dfc1013d603ccbffcf08b9277f3759adeddb13221f66221f9365088e08396.json',h=Object.assign({cache:!0},{doc:{id:'id',field:['title','content'],store:['title','href','section']}}),a=document.querySelector('#book-search-input'),b=document.querySelector('#book-search-results');if(!a)return;a.addEventListener('focus',c),a.addEventListener('keyup',d),document.addEventListener('keypress',e);function e(b){if(b.target.value!==void 0)return;if(a===document.activeElement)return;const c=String.fromCharCode(b.charCode);if(!f(c))return;a.focus(),b.preventDefault()}function f(b){const c=a.getAttribute('data-hotkeys')||'';return c.indexOf(b)>=0}function c(){a.removeEventListener('focus',c),a.required=!0,fetch(g).then(a=>a.json()).then(a=>{window.bookSearchIndex=FlexSearch.create('balance',h),window.bookSearchIndex.add(a)}).then(()=>a.required=!1).then(d)}function d(){while(b.firstChild)b.removeChild(b.firstChild);if(!a.value)return;const c=window.bookSearchIndex.search(a.value,10);c.forEach(function(a){const c=i('<li><a href></a><small></small></li>'),d=c.querySelector('a'),e=c.querySelector('small');d.href=a.href,d.textContent=a.title,e.textContent=a.section,b.appendChild(c)})}function i(b){const a=document.createElement('div');return a.innerHTML=b,a.firstChild}})()

View File

@ -1 +1 @@
'use strict';(function(){const g='/en.search-data.min.6806f2940864c38ac970533659e149f4f937f0861c0157e18dd617e609a616c9.json',h=Object.assign({cache:!0},{doc:{id:'id',field:['title','content'],store:['title','href','section']}}),a=document.querySelector('#book-search-input'),b=document.querySelector('#book-search-results');if(!a)return;a.addEventListener('focus',c),a.addEventListener('keyup',d),document.addEventListener('keypress',e);function e(b){if(b.target.value!==void 0)return;if(a===document.activeElement)return;const c=String.fromCharCode(b.charCode);if(!f(c))return;a.focus(),b.preventDefault()}function f(b){const c=a.getAttribute('data-hotkeys')||'';return c.indexOf(b)>=0}function c(){a.removeEventListener('focus',c),a.required=!0,fetch(g).then(a=>a.json()).then(a=>{window.bookSearchIndex=FlexSearch.create('balance',h),window.bookSearchIndex.add(a)}).then(()=>a.required=!1).then(d)}function d(){while(b.firstChild)b.removeChild(b.firstChild);if(!a.value)return;const c=window.bookSearchIndex.search(a.value,10);c.forEach(function(a){const c=i('<li><a href></a><small></small></li>'),d=c.querySelector('a'),e=c.querySelector('small');d.href=a.href,d.textContent=a.title,e.textContent=a.section,b.appendChild(c)})}function i(b){const a=document.createElement('div');return a.innerHTML=b,a.firstChild}})() 'use strict';(function(){const g='/en.search-data.min.a17f15b6606b2f5bbc75a90c42a71729974161701128982784c7bd5f699638ad.json',h=Object.assign({cache:!0},{doc:{id:'id',field:['title','content'],store:['title','href','section']}}),a=document.querySelector('#book-search-input'),b=document.querySelector('#book-search-results');if(!a)return;a.addEventListener('focus',c),a.addEventListener('keyup',d),document.addEventListener('keypress',e);function e(b){if(b.target.value!==void 0)return;if(a===document.activeElement)return;const c=String.fromCharCode(b.charCode);if(!f(c))return;a.focus(),b.preventDefault()}function f(b){const c=a.getAttribute('data-hotkeys')||'';return c.indexOf(b)>=0}function c(){a.removeEventListener('focus',c),a.required=!0,fetch(g).then(a=>a.json()).then(a=>{window.bookSearchIndex=FlexSearch.create('balance',h),window.bookSearchIndex.add(a)}).then(()=>a.required=!1).then(d)}function d(){while(b.firstChild)b.removeChild(b.firstChild);if(!a.value)return;const c=window.bookSearchIndex.search(a.value,10);c.forEach(function(a){const c=i('<li><a href></a><small></small></li>'),d=c.querySelector('a'),e=c.querySelector('small');d.href=a.href,d.textContent=a.title,e.textContent=a.section,b.appendChild(c)})}function i(b){const a=document.createElement('div');return a.innerHTML=b,a.firstChild}})()

View File

@ -0,0 +1 @@
'use strict';(function(){const g='/en.search-data.min.beee4efcef9543320718b25c45ba4b8ba22502436bbf8d207465575b23c43a25.json',h=Object.assign({cache:!0},{doc:{id:'id',field:['title','content'],store:['title','href','section']}}),a=document.querySelector('#book-search-input'),b=document.querySelector('#book-search-results');if(!a)return;a.addEventListener('focus',c),a.addEventListener('keyup',d),document.addEventListener('keypress',e);function e(b){if(b.target.value!==void 0)return;if(a===document.activeElement)return;const c=String.fromCharCode(b.charCode);if(!f(c))return;a.focus(),b.preventDefault()}function f(b){const c=a.getAttribute('data-hotkeys')||'';return c.indexOf(b)>=0}function c(){a.removeEventListener('focus',c),a.required=!0,fetch(g).then(a=>a.json()).then(a=>{window.bookSearchIndex=FlexSearch.create('balance',h),window.bookSearchIndex.add(a)}).then(()=>a.required=!1).then(d)}function d(){while(b.firstChild)b.removeChild(b.firstChild);if(!a.value)return;const c=window.bookSearchIndex.search(a.value,10);c.forEach(function(a){const c=i('<li><a href></a><small></small></li>'),d=c.querySelector('a'),e=c.querySelector('small');d.href=a.href,d.textContent=a.title,e.textContent=a.section,b.appendChild(c)})}function i(b){const a=document.createElement('div');return a.innerHTML=b,a.firstChild}})()

View File

@ -0,0 +1 @@
'use strict';(function(){const g='/en.search-data.min.dd2c536f8c3960528c583f819c200056d2d0e962aa5ab68d0ff1aa16e69db682.json',h=Object.assign({cache:!0},{doc:{id:'id',field:['title','content'],store:['title','href','section']}}),a=document.querySelector('#book-search-input'),b=document.querySelector('#book-search-results');if(!a)return;a.addEventListener('focus',c),a.addEventListener('keyup',d),document.addEventListener('keypress',e);function e(b){if(b.target.value!==void 0)return;if(a===document.activeElement)return;const c=String.fromCharCode(b.charCode);if(!f(c))return;a.focus(),b.preventDefault()}function f(b){const c=a.getAttribute('data-hotkeys')||'';return c.indexOf(b)>=0}function c(){a.removeEventListener('focus',c),a.required=!0,fetch(g).then(a=>a.json()).then(a=>{window.bookSearchIndex=FlexSearch.create('balance',h),window.bookSearchIndex.add(a)}).then(()=>a.required=!1).then(d)}function d(){while(b.firstChild)b.removeChild(b.firstChild);if(!a.value)return;const c=window.bookSearchIndex.search(a.value,10);c.forEach(function(a){const c=i('<li><a href></a><small></small></li>'),d=c.querySelector('a'),e=c.querySelector('small');d.href=a.href,d.textContent=a.title,e.textContent=a.section,b.appendChild(c)})}function i(b){const a=document.createElement('div');return a.innerHTML=b,a.firstChild}})()

View File

@ -0,0 +1 @@
'use strict';(function(){const g='/en.search-data.min.b06d77f831d6db27558b27168671b1d70a438ea4972578117a72ccdc810b62d9.json',h=Object.assign({cache:!0},{doc:{id:'id',field:['title','content'],store:['title','href','section']}}),a=document.querySelector('#book-search-input'),b=document.querySelector('#book-search-results');if(!a)return;a.addEventListener('focus',c),a.addEventListener('keyup',d),document.addEventListener('keypress',e);function e(b){if(b.target.value!==void 0)return;if(a===document.activeElement)return;const c=String.fromCharCode(b.charCode);if(!f(c))return;a.focus(),b.preventDefault()}function f(b){const c=a.getAttribute('data-hotkeys')||'';return c.indexOf(b)>=0}function c(){a.removeEventListener('focus',c),a.required=!0,fetch(g).then(a=>a.json()).then(a=>{window.bookSearchIndex=FlexSearch.create('balance',h),window.bookSearchIndex.add(a)}).then(()=>a.required=!1).then(d)}function d(){while(b.firstChild)b.removeChild(b.firstChild);if(!a.value)return;const c=window.bookSearchIndex.search(a.value,10);c.forEach(function(a){const c=i('<li><a href></a><small></small></li>'),d=c.querySelector('a'),e=c.querySelector('small');d.href=a.href,d.textContent=a.title,e.textContent=a.section,b.appendChild(c)})}function i(b){const a=document.createElement('div');return a.innerHTML=b,a.firstChild}})()

View File

@ -0,0 +1 @@
'use strict';(function(){const g='/en.search-data.min.c3c8112245569dcf08d8fecf2f587205d7222f693c27371116055276d4b3ea20.json',h=Object.assign({cache:!0},{doc:{id:'id',field:['title','content'],store:['title','href','section']}}),a=document.querySelector('#book-search-input'),b=document.querySelector('#book-search-results');if(!a)return;a.addEventListener('focus',c),a.addEventListener('keyup',d),document.addEventListener('keypress',e);function e(b){if(b.target.value!==void 0)return;if(a===document.activeElement)return;const c=String.fromCharCode(b.charCode);if(!f(c))return;a.focus(),b.preventDefault()}function f(b){const c=a.getAttribute('data-hotkeys')||'';return c.indexOf(b)>=0}function c(){a.removeEventListener('focus',c),a.required=!0,fetch(g).then(a=>a.json()).then(a=>{window.bookSearchIndex=FlexSearch.create('balance',h),window.bookSearchIndex.add(a)}).then(()=>a.required=!1).then(d)}function d(){while(b.firstChild)b.removeChild(b.firstChild);if(!a.value)return;const c=window.bookSearchIndex.search(a.value,10);c.forEach(function(a){const c=i('<li><a href></a><small></small></li>'),d=c.querySelector('a'),e=c.querySelector('small');d.href=a.href,d.textContent=a.title,e.textContent=a.section,b.appendChild(c)})}function i(b){const a=document.createElement('div');return a.innerHTML=b,a.firstChild}})()

View File

@ -0,0 +1 @@
'use strict';(function(){const g='/en.search-data.min.13c1dfa15aa0755b0307987ec43aac6e5a688d7d4566205e481b915bcd260306.json',h=Object.assign({cache:!0},{doc:{id:'id',field:['title','content'],store:['title','href','section']}}),a=document.querySelector('#book-search-input'),b=document.querySelector('#book-search-results');if(!a)return;a.addEventListener('focus',c),a.addEventListener('keyup',d),document.addEventListener('keypress',e);function e(b){if(b.target.value!==void 0)return;if(a===document.activeElement)return;const c=String.fromCharCode(b.charCode);if(!f(c))return;a.focus(),b.preventDefault()}function f(b){const c=a.getAttribute('data-hotkeys')||'';return c.indexOf(b)>=0}function c(){a.removeEventListener('focus',c),a.required=!0,fetch(g).then(a=>a.json()).then(a=>{window.bookSearchIndex=FlexSearch.create('balance',h),window.bookSearchIndex.add(a)}).then(()=>a.required=!1).then(d)}function d(){while(b.firstChild)b.removeChild(b.firstChild);if(!a.value)return;const c=window.bookSearchIndex.search(a.value,10);c.forEach(function(a){const c=i('<li><a href></a><small></small></li>'),d=c.querySelector('a'),e=c.querySelector('small');d.href=a.href,d.textContent=a.title,e.textContent=a.section,b.appendChild(c)})}function i(b){const a=document.createElement('div');return a.innerHTML=b,a.firstChild}})()

View File

@ -0,0 +1 @@
'use strict';(function(){const g='/en.search-data.min.027a509f040b96745c9d3697ed7c204e3084985d715b3fed15fe5da9627593e1.json',h=Object.assign({cache:!0},{doc:{id:'id',field:['title','content'],store:['title','href','section']}}),a=document.querySelector('#book-search-input'),b=document.querySelector('#book-search-results');if(!a)return;a.addEventListener('focus',c),a.addEventListener('keyup',d),document.addEventListener('keypress',e);function e(b){if(b.target.value!==void 0)return;if(a===document.activeElement)return;const c=String.fromCharCode(b.charCode);if(!f(c))return;a.focus(),b.preventDefault()}function f(b){const c=a.getAttribute('data-hotkeys')||'';return c.indexOf(b)>=0}function c(){a.removeEventListener('focus',c),a.required=!0,fetch(g).then(a=>a.json()).then(a=>{window.bookSearchIndex=FlexSearch.create('balance',h),window.bookSearchIndex.add(a)}).then(()=>a.required=!1).then(d)}function d(){while(b.firstChild)b.removeChild(b.firstChild);if(!a.value)return;const c=window.bookSearchIndex.search(a.value,10);c.forEach(function(a){const c=i('<li><a href></a><small></small></li>'),d=c.querySelector('a'),e=c.querySelector('small');d.href=a.href,d.textContent=a.title,e.textContent=a.section,b.appendChild(c)})}function i(b){const a=document.createElement('div');return a.innerHTML=b,a.firstChild}})()

View File

@ -13,6 +13,9 @@
</url><url> </url><url>
<loc>https://docs.wakuconnect.dev/docs/guides/01_choose_content_topic/</loc> <loc>https://docs.wakuconnect.dev/docs/guides/01_choose_content_topic/</loc>
<lastmod>2022-01-27T11:18:41+11:00</lastmod> <lastmod>2022-01-27T11:18:41+11:00</lastmod>
</url><url>
<loc>https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/</loc>
<lastmod>2022-03-10T16:49:49+11:00</lastmod>
</url><url> </url><url>
<loc>https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/02_connect_wallet/</loc> <loc>https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/02_connect_wallet/</loc>
<lastmod>2022-02-11T22:11:16+11:00</lastmod> <lastmod>2022-02-11T22:11:16+11:00</lastmod>
@ -42,7 +45,7 @@
<lastmod>2022-02-02T11:56:14+11:00</lastmod> <lastmod>2022-02-02T11:56:14+11:00</lastmod>
</url><url> </url><url>
<loc>https://docs.wakuconnect.dev/docs/guides/sign_messages_web3_eip712/</loc> <loc>https://docs.wakuconnect.dev/docs/guides/sign_messages_web3_eip712/</loc>
<lastmod>2022-02-24T16:49:46+11:00</lastmod> <lastmod>2022-03-10T16:45:38+11:00</lastmod>
</url><url> </url><url>
<loc>https://docs.wakuconnect.dev/docs/guides/05_sign_messages_version_1/</loc> <loc>https://docs.wakuconnect.dev/docs/guides/05_sign_messages_version_1/</loc>
<lastmod>2022-01-24T12:17:00+11:00</lastmod> <lastmod>2022-01-24T12:17:00+11:00</lastmod>
@ -123,7 +126,7 @@
<lastmod>2022-02-10T10:33:56+11:00</lastmod> <lastmod>2022-02-10T10:33:56+11:00</lastmod>
</url><url> </url><url>
<loc>https://docs.wakuconnect.dev/docs/guides/</loc> <loc>https://docs.wakuconnect.dev/docs/guides/</loc>
<lastmod>2022-02-24T16:49:46+11:00</lastmod> <lastmod>2022-03-10T16:45:38+11:00</lastmod>
</url><url> </url><url>
<loc>https://docs.wakuconnect.dev/docs/examples/</loc> <loc>https://docs.wakuconnect.dev/docs/examples/</loc>
<lastmod>2022-02-18T09:38:14+00:00</lastmod> <lastmod>2022-02-18T09:38:14+00:00</lastmod>

View File

@ -20,7 +20,7 @@ Waku can be used for chat purposes and for many machine-to-machine use cases.">
<link rel="alternate" hreflang="pt" href="https://docs.wakuconnect.dev/pt/" title="Introdução"> <link rel="alternate" hreflang="pt" href="https://docs.wakuconnect.dev/pt/" title="Introdução">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/index.xml" title="Waku Connect Docs" /> <link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/index.xml" title="Waku Connect Docs" />
<!-- <!--
Made with Book Theme Made with Book Theme
@ -196,6 +196,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>

View File

@ -44,6 +44,16 @@ The format for content topics is as follows:
dapp-name: The name of your dApp, it must be unique to avoid conflict with other dApps. version: We usually start at 1, useful when introducing breaking changes in your messages.</description> dapp-name: The name of your dApp, it must be unique to avoid conflict with other dApps. version: We usually start at 1, useful when introducing breaking changes in your messages.</description>
</item> </item>
<item>
<title>Discovery &amp; Bootstrap Nodes</title>
<link>https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/</link>
<pubDate>Thu, 17 Feb 2022 00:00:00 +0100</pubDate>
<guid>https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/</guid>
<description>Discovery &amp;amp; Bootstrap Nodes # This guide explains the discovery and bootstrap mechanisms currently available in js-waku, their benefits and caveats and how to use them.
Node discovery is the mechanism that enables a Waku node to find other nodes. Waku is a modular protocol, several discovery mechanisms are and will be included in Waku so that developers can select the best mechanism(s) based for their use case and the user&amp;rsquo;s environment (e.</description>
</item>
<item> <item>
<title>Connect to the Ethereum Wallet</title> <title>Connect to the Ethereum Wallet</title>
<link>https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/02_connect_wallet/</link> <link>https://docs.wakuconnect.dev/docs/guides/vote_poll_sdk/dapp_creation/02_connect_wallet/</link>

View File

@ -4,7 +4,7 @@
<sitemap> <sitemap>
<loc>https://docs.wakuconnect.dev/en/sitemap.xml</loc> <loc>https://docs.wakuconnect.dev/en/sitemap.xml</loc>
<lastmod>2022-02-24T16:49:46+11:00</lastmod> <lastmod>2022-03-10T16:49:49+11:00</lastmod>
</sitemap> </sitemap>

View File

@ -17,7 +17,7 @@
<link rel="alternate" hreflang="pt" href="https://docs.wakuconnect.dev/pt/tags/" title="Tags"> <link rel="alternate" hreflang="pt" href="https://docs.wakuconnect.dev/pt/tags/" title="Tags">
<link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous"> <link rel="stylesheet" href="/book.min.89a77f7e702a8626749b948bbfb01109823daf6c1246ca407d1378833494c402.css" integrity="sha256-iad/fnAqhiZ0m5SLv7ARCYI9r2wSRspAfRN4gzSUxAI=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script> <script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.5e83bf04e893fa1e3be0cc685b6d954db2182e1bc337707df7f86bcb08af65cb.js" integrity="sha256-XoO/BOiT&#43;h474MxoW22VTbIYLhvDN3B99/hrywivZcs=" crossorigin="anonymous"></script> <script defer src="/en.search.min.a97e71fa4cb8e429282d05b1e3d12d5f2b9444c6dbf351fe5ed619a9c87e175f.js" integrity="sha256-qX5x&#43;ky45CkoLQWx49EtXyuURMbb81H&#43;XtYZqch&#43;F18=" crossorigin="anonymous"></script>
<link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/tags/index.xml" title="Waku Connect Docs" /> <link rel="alternate" type="application/rss+xml" href="https://docs.wakuconnect.dev/tags/index.xml" title="Waku Connect Docs" />
<!-- <!--
Made with Book Theme Made with Book Theme
@ -193,6 +193,19 @@ https://github.com/alex-shpak/hugo-book
<a href="https://docs.wakuconnect.dev/docs/guides/discovery_bootstrap/" class="">Discovery &amp; Bootstrap Nodes</a>
</li>
<li>
<a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a> <a href="https://docs.wakuconnect.dev/docs/guides/02_relay_receive_send_messages/" class="">Receive and Send Messages Using Waku Relay</a>