The latest articles on DEV Community by Ayush Jain (@aj54). https://dev.to/aj54 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F186031%2F607bd72e-761f-4cbd-8ea2-f70098fcf07d.jpg https://dev.to/aj54 en Ayush Jain Tue, 27 Jul 2021 10:29:10 +0000 https://dev.to/aj54/add-messaging-file-sharing-activity-feeds-in-your-website-easily-2jlf https://dev.to/aj54/add-messaging-file-sharing-activity-feeds-in-your-website-easily-2jlf <h1> What is Weavy? </h1> <p>Weavy is an in-app collaboration API and SDK, meaning that it provides you easy way to add features like in-app messaging, in-app activity feeds, in-app file sharing and in-app tasks management. <br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--acEaEejm--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6yuauk7p3tuvek65ikcr.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--acEaEejm--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6yuauk7p3tuvek65ikcr.jpg" alt="Weavy" width="400" height="400"></a></p> <h2> What does in-app mean? </h2> <p>In-app means that users will remain on your website/application and thus, you can add these features WITHOUT losing your user. Weavy has been designed with simplicity, easy usability, quick integration and complete feature set in mind. </p> <h2> Can I try it without doing anything? </h2> <p>Sure, you can play around with all the features by going to <a href="https://www.weavy.com/try/app">https://www.weavy.com/try/app</a></p> <h2> How is my data secured? </h2> <p>Your data is stored inside your cloud. Weavy provides you complete SDK (Client, Server, Tenant and Mobile) and you will be hosting everything on your cloud. Thus, your data never leaves your system. </p> <h2> How to get started? </h2> <p>You can get started on your local machine by following <a href="https://www.weavy.com/developer/getting-started/introduction-to-weavy">this</a> article. </p> <h2> Is it Free? </h2> <p>Weavy provide 30 days of FREE trial to all features (no questions asked, no limits placed). After that, the sales team will help you to get onboard or provide more extension. </p> <h2> Need Help? </h2> <p>You can use <a href="https://www.weavy.com/developer/contact">Get Help</a> form to reach out and get assistance immediately.</p> programming productivity sdk collaboration Ayush Jain Tue, 09 Feb 2021 16:22:19 +0000 https://dev.to/aj54/using-blockonomics-payment-button-api-3n68 https://dev.to/aj54/using-blockonomics-payment-button-api-3n68 <p>The Links to relevant resources:</p> <ul> <li>Create your Blockonomics Account- <a href="https://www.blockonomics.co/merchants?ref=hPga3rGcrDj45w1C2jzkDMUPGBkCRYxNE6">here</a> </li> <li>The Blog Post - <a href="https://dev.to/aj54/blockonomics-payment-button-api-k3p">here</a> </li> <li>The Github Repository - <a href="https://github.com/blockonomics/Blockonomics_Payment_Button_Demo">here</a> </li> <li>Creating Your Payment Button - <a href="https://www.youtube.com/watch?v=1sE2r5tDkNY">here</a> </li> <li>Setup local server for testing - <a href="https://dev.to/aj54/testing-blockonomics-api-locally-9gi">here</a> </li> <li>Blockonomics Payments API Documentation - <a href="https://www.blockonomics.co/views/api.html#payments">here</a> </li> </ul> beginners php laravel tutorial Ayush Jain Tue, 09 Feb 2021 16:17:06 +0000 https://dev.to/aj54/using-blockonomics-bitcoin-payments-api-1ldc https://dev.to/aj54/using-blockonomics-bitcoin-payments-api-1ldc <p>The Link to relevant resources:</p> <ul> <li>Create your Blockonomics Account- <a href="https://www.blockonomics.co/merchants?ref=hPga3rGcrDj45w1C2jzkDMUPGBkCRYxNE6">here</a> </li> <li>Github Repository - <a href="https://github.com/blockonomics/Django-Image-Store">here</a> </li> <li>Blockonomics Account Create - <a href="http://blockonomics.co/">here</a> </li> <li>Blockonomics API Documentation - <a href="https://www.blockonomics.co/views/api.html#payments">here</a> </li> <li>Setting Up HTTP Callback URL - <a href="https://www.blockonomics.co/merchants#/page3">here</a> </li> <li>The Blog Post - <a href="https://dev.to/aj54/using-blockonomics-bitcoin-payments-api-5021">here</a> </li> </ul> beginners django python javascript Ayush Jain Tue, 09 Feb 2021 16:11:58 +0000 https://dev.to/aj54/testing-blockonomics-api-locally-9gi https://dev.to/aj54/testing-blockonomics-api-locally-9gi <p>The Link to Resources:</p> <ul> <li>Create your Blockonomics Account- <a href="https://www.blockonomics.co/merchants?ref=hPga3rGcrDj45w1C2jzkDMUPGBkCRYxNE6">here</a> </li> <li>Ngrok Download - <a href="https://ngrok.com/download">here</a> </li> <li>localtunnel - <a href="https://github.com/localtunnel/localtunnel">here</a> </li> <li>Create Blockonomics Account - <a href="http://blockonomics.co">here</a> </li> <li>The Blog - <a href="https://dev.to/aj54/testing-blockonomics-payment-api-s-locally-h11">here</a> </li> </ul> testing beginners programming Ayush Jain Mon, 01 Feb 2021 10:30:30 +0000 https://dev.to/aj54/blockonomics-payment-button-api-k3p https://dev.to/aj54/blockonomics-payment-button-api-k3p <p>In this tutorial, we are going to look at a super-easy way to accept Bitcoin payments on your website. This method requires just a few lines of code and the majority of work is done by Blockonomics.</p> <h1> What is Blockonomics? </h1> <p>Blockonomics is a decentralized Bitcoin payment solution that provides you with specialized transactional tools to enhance your BTC use. With Blockonomics, you can generate Bitcoins by accepting it on your online stores, as well as utilitarian features such as creating P2P invoices, sending emails via Bitcoin, and tracking your wallet addresses.</p> <h1> What we’re building </h1> <p>We are building an online art shop. The purpose of this Demo shop is to showcase the use of Payment Button API. In order to gain premium content from the shop, you need to purchase the premium pass. This transaction will be done using the Blockonomics Payment Button API.</p> <h2> Setting Up </h2> <p>The entire code for this demo is available on Github and you can fork it <a href="https://github.com/AJ-54/Blockonomics_Payment_Button_Demo" rel="noopener noreferrer">here</a>. The step by step instructions on how to set up the demo is provided in the <code>README</code>. </p> <p>Once you have completed the setup, you can now navigate to <code>http://127.0.0.1:8000/</code> to see the demo live. </p> <h2> Native Payment API vs Payment Button API </h2> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Features</th> <th>Native Payments API</th> <th>Payment Button API</th> </tr> </thead> <tbody> <tr> <td></td> <td></td> <td></td> </tr> <tr> <td>Order/Bitcoin Address Management</td> <td>You</td> <td>Blockonomics</td> </tr> <tr> <td>Checkout Interface</td> <td>You</td> <td>Blockonomics</td> </tr> <tr> <td>Automated email for order confirmations</td> <td>You</td> <td>Blockonomics</td> </tr> <tr> <td>Customer Field Input</td> <td>You</td> <td>Blockonomics</td> </tr> </tbody> </table></div> <p>The above table summarises that if you do not want to worry much about how the bitcoin address is being managed, how the checkout interface of my website looks like, and other utilities like order confirmation mail, etc., then Blockonomics Payment Button API is the right choice for you. But, if you care about the checkout interface or the way email messages are being sent to your customers, you can choose to go with native Payments API and create your own stuff from scratch. The blog for native Payments API can be found <a href="https://dev.to/aj54/using-blockonomics-bitcoin-payments-api-5021">here</a>.</p> <h2> The Logic </h2> <p>You might have placed your own Payment Button in the code when doing the setup. It is important to configure the Database and understand the logic for the Order Hook URL endpoint. </p> <h3> Database Configuration </h3> <p>Since we are using the Payment Buttons API, all the concerned stuff is taken care by Blockonomics, so we just need to know which user is a premium user and which is a standard (non-premium) user. Thus, I have simply added <code>status</code> field in <code>User</code> table to attach the <a href="https://www.blockonomics.co/views/api.html#paymentbuttons" rel="noopener noreferrer">status code</a> of the transaction made by that user.<br> <a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fmd8x9xe37z2mhbt62oyo.png" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fmd8x9xe37z2mhbt62oyo.png" alt="Alt Text"></a></p> <h3> Order Hook URL and Redirection URL </h3> <p>It is really important to understand the meaning of the above terms before you code your logic. <br> <code>Order Hook URL</code> is the endpoint that is used by Blockonomics to provide you status update notifications of the transactions done using Payment Buttons/Links you created.<br> <code>Redirection URL</code> is the endpoint on which the user is redirected once the transaction is carried out. This does not mean the transaction was successful, and thus your redirection URL should <strong>NOT</strong> point towards the paid content. <br> You should unlock the premium content only upon the confirmation received on the <code>Order Hook URL</code> from Blockonomics.</p> <h3> Order Hook URL Endpoint Logic </h3> <p>Blockonomics hits the endpoint with a <code>GET</code> request, passing the Bitcoin <code>address</code> and the <code>status</code> of the transaction carried using the given address. <br> We can use the <a href="https://www.blockonomics.co/views/api.html#paymentbuttons" rel="noopener noreferrer"><em>Get Order API</em></a> to know the details about the user who used the given bitcoin address to perform the transaction. <code>Email</code> can be used as a source of identification but you can pass any logic as you like. Here, we identify the user using the email and update the status of that user with the one that Blockonomics provided.<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>public function handle(Request $request) { $address = $request-&gt;addr; $status = $request-&gt;status; try{ $client = new Client(); $response = $client-&gt;get('https://www.blockonomics.co/api/merchant_order/'.$address,[ 'headers'=&gt;['Authorization'=&gt; 'Bearer '.env('Blockonomics_API','')], ]); $data = json_decode($response-&gt;getBody()); $data_string =json_encode($data); $mail = $data-&gt;data-&gt;emailid; $user = User::where('email','=',$mail)-&gt;first(); $user-&gt;status = (string)$status; $user-&gt;save(); } catch (\Exception $e){ error_log($e); } } </code></pre> </div> <p>Thus, we successfully configured the Order Hook URL Endpoint. We can easily use the status information anywhere in our code to know if we can grant access to some information for this user. </p> <h2> The End </h2> <p>Before we end, the video tutorial for this entire demo is linked below. For any queries, feel free to use the comments section!<br> <iframe width="710" height="399" src="https://www.youtube.com/embed/IFjfkD3nRNE"> </iframe> </p> beginners php tutorial laravel Ayush Jain Fri, 29 Jan 2021 08:08:23 +0000 https://dev.to/aj54/testing-blockonomics-payment-api-s-locally-h11 https://dev.to/aj54/testing-blockonomics-payment-api-s-locally-h11 <p>In this tutorial, we are going to understand how to test our Blockonomics Payment APIs locally without deploying them to the production/testing environment. </p> <h1> What is Blockonomics? </h1> <p>Blockonomics is a decentralized Bitcoin payment solution that provides you with specialized transactional tools to enhance your BTC use. With Blockonomics, you can generate Bitcoins by accepting it on your online stores, as well as utilitarian features such as creating P2P invoices, sending emails via Bitcoin, and tracking your wallet addresses. Create your Blockonomics Account- <a href="https://www.blockonomics.co/merchants?ref=hPga3rGcrDj45w1C2jzkDMUPGBkCRYxNE6" rel="noopener noreferrer">here</a></p> <h1> What we’re building </h1> <p>We are going to understand the use of reverse proxy, allowing us to create a public URL for the code which is local to our system. Using the public URL, we can place it as an endpoint to the HTTP Callback URL required by Blockonomics. </p> <h1> Setting Up </h1> <p>In order to expose our code to the public URL's, we shall use the Ngrok. Later, we will generate the public URL which actively listens to a specific port on our local system. This allows us to communicate from that port with the rest of the world!</p> <h2> Installing Ngrok </h2> <p>To install Ngrok on your machine, refer to the <a href="https://ngrok.com/download" rel="noopener noreferrer">official page</a>. After you download, navigate to the directory and type <code>ngrok.exe http 8000</code>. This will start listening to the <code>8000</code> port and you can see a terminal page like this: <br> <a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fos3jlyiz2yeoy3mxyd9o.png" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fos3jlyiz2yeoy3mxyd9o.png" alt="Alt Text"></a></p> <p>In my case, the public URL is <code>http://7db20c5efe6d.ngrok.io</code> and I can make requests on this URL and it will redirect those requests to my localhost at the specified port, in our case port <code>8000</code>. </p> <h2> Configuring HTTP CallBack URL </h2> <p>Once you have a public URL listening to your localhost, you can use it as a webhook to test the Blockonomic Payment APIs. For example, you have configured a <code>/receive/</code> route that is responsible for processing the requests coming from Blockonomics about the status update of the transactions, then you should set up the HTTP Callback URL as <code>&lt;your_ngrok_domain&gt;/receive</code> on <a href="https://www.blockonomics.co/merchants#/page3" rel="noopener noreferrer">this page</a> and this will redirect the Blockonomics requests to your localhost at the specified route. <br> Thus, you can test your logic and the Blockonomics Payment APIs without deploying them to any cloud platform. </p> <h1> The END </h1> <p>Here is the youtube video, explaining the entire tutorial on testing the Blockonomics Payment API's locally. If you have any queries, feel free to use the comments section!</p> <p><iframe width="710" height="399" src="https://www.youtube.com/embed/6Ydk32avIgo"> </iframe> </p> tutorial beginners testing programming Ayush Jain Sat, 23 Jan 2021 16:24:58 +0000 https://dev.to/aj54/using-blockonomics-bitcoin-payments-api-5021 https://dev.to/aj54/using-blockonomics-bitcoin-payments-api-5021 <p>In this tutorial, we are going to use Blockonomics Payment API to receive Bitcoin payments on our website.</p> <h1> What is Blockonomics? </h1> <p>Blockonomics is a decentralized Bitcoin payment solution that provides you with specialized transactional tools to enhance your BTC use. With Blockonomics, you can generate Bitcoins by accepting it on your online stores, as well as utilitarian features such as creating P2P invoices, sending emails via Bitcoin, and tracking your wallet addresses. </p> <h1> What we’re building </h1> <p>We will create an online shop that will accept Bitcoin payments using <a href="https://www.blockonomics.co/views/api.html#payments">Blockonomics Payment API</a>. Let’s get started!</p> <h2> Tech Stack </h2> <ul> <li>Django</li> <li>HTML/CSS</li> <li>Javascript</li> </ul> <h2> Setting Up </h2> <p>Before getting started, you can set up the local version of this tutorial using <a href="https://github.com/AJ-54/Blockonomics">github repository</a><br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>git clone https://github.com/AJ-54/Blockonomics.git pip install -r requirements.txt </code></pre> </div> <p>Make sure you have your Blockonomics API Key handy. To get one for free, <a href="https://www.blockonomics.co/register#">create your account</a> and get to <a href="https://www.blockonomics.co/merchants">this</a> page.</p> <blockquote> <p>Inside Blockonomics folder, go to <code>settings.py</code> file and place your <strong>API KEY</strong> to the <code>API_KEY</code> variable<br> </p> </blockquote> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>python manage.py migrate python manage.py runserver </code></pre> </div> <p>Now, if you go to <a href="http://127.0.0.1:8000">http://127.0.0.1:8000</a>, you will be able to see the same screen like that of <a href="https://blockonomics.herokuapp.com">https://blockonomics.herokuapp.com</a></p> <h3> The HTTP Callback URL </h3> <p>To use the Bitcoin payments API, you need to set up the order hook URL at your <a href="https://www.blockonomics.co/merchants#/page3">merchant page</a> on the Blockonomics website. Every time a transaction carried on the address associated with your API key changes its status, Blockonomics will use the HTTP Callback URL provided by you to notify you about the status update. Also, new transaction notifications are also provided using the same HTTP Callback URL.</p> <h2> The Logic </h2> <p>In order to integrate Blockonomics payment API, you should know how the process works. Firstly, you need the Blockonomics account and your API Key. Next, you should use a unique Bitcoin address every time you do a transaction. You can request a new address using the <a href="https://www.blockonomics.co/views/api.html#newaddress">New Address API</a>. Once the buyer uses that Bitcoin address to transfer the amount, you will get the status update from Blockonomics on the <code>HTTP Callback URL</code> provided by you. Thus, your backend logic must process the requests received at that endpoint to classify the transactions.</p> <h2> Payments App </h2> <p>I have created a core Django application called <code>payments</code> which is responsible for everything. </p> <h3> Understanding Models </h3> <p>To store the information about the transactions, I created an <code>Invoice</code> table. The table looks like this<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>class Invoice(models.Model): STATUS_CHOICES = ((-1,"Not Started"),(0,'Unconfirmed'), (1,"Partially Confirmed"), (2,"Confirmed")) product = models.ForeignKey("Product", on_delete=models.CASCADE) status = models.IntegerField(choices=STATUS_CHOICES, default=-1) order_id = models.CharField(max_length=250) address = models.CharField(max_length=250, blank=True, null=True) btcvalue = models.IntegerField(blank=True, null=True) received = models.IntegerField(blank=True, null=True) txid = models.CharField(max_length=250, blank=True, null=True) rbf = models.IntegerField(blank=True, null=True) created_at = models.DateField(auto_now=True) </code></pre> </div> <p>The <code>Invoice</code> table stores the <code>product</code> for which the invoice is created, the <code>address</code> is the Bitcoin address used for this transaction. The <code>btcvalue</code> is the amount that you have charged from the buyer and <code>received</code> is the amount you receive from the buyer. Both these values will be in satoshi. The most important field is <code>status</code> which describes the current status of this transaction. </p> <h3> Creating Payment Invoice </h3> <p>Once the user clicks on the price button, we process the request inside <code>create_payment</code> view. The job here is to create a new object in the <code>Invoice</code> table and then redirect the request to the <code>track_invoice</code> view.<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>def exchanged_rate(amount): url = "https://www.blockonomics.co/api/price?currency=USD" r = requests.get(url) response = r.json() return amount/response['price'] def create_payment(request, pk): product_id = pk product = Product.objects.get(id=product_id) url = 'https://www.blockonomics.co/api/new_address' headers = {'Authorization': "Bearer " + settings.API_KEY} r = requests.post(url, headers=headers) print(r.json()) if r.status_code == 200: address = r.json()['address'] bits = exchanged_rate(product.price) order_id = uuid.uuid1() invoice = Invoice.objects.create(order_id=order_id, address=address,btcvalue=bits*1e8, product=product) return HttpResponseRedirect(reverse('payments:track_payment', kwargs={'pk':invoice.id})) else: print(r.status_code, r.text) return HttpResponse("Some Error, Try Again!") </code></pre> </div> <h3> HTTP Callback URL Endpoint </h3> <p>The <code>receive_payment</code> view is the endpoint for receiving status updates from Blockonomics. It is used to sync our <code>Invoice</code> table in the database with recent transactions and their status updates.<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>def receive_payment(request): if (request.method != 'GET'): return txid = request.GET.get('txid') value = request.GET.get('value') status = request.GET.get('status') addr = request.GET.get('addr') invoice = Invoice.objects.get(address = addr) invoice.status = int(status) if (int(status) == 2): invoice.received = value invoice.txid = txid invoice.save() return HttpResponse(200) </code></pre> </div> <h3> Tracking Payment Invoice </h3> <p>You can track any invoice if you know the invoice ID. The <code>track_invoice</code> view fetches the latest data of that invoice ID from our database and passes it to the frontend. It also passes whether the user has paid the required amount, if yes then the <code>paid</code> variable is also passed to the frontend. At this point, you can add your business logic.<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>def track_invoice(request, pk): invoice_id = pk invoice = Invoice.objects.get(id=invoice_id) data = { 'order_id':invoice.order_id, 'bits':invoice.btcvalue/1e8, 'value':invoice.product.price, 'addr': invoice.address, 'status':Invoice.STATUS_CHOICES[invoice.status+1][1], 'invoice_status': invoice.status, } if (invoice.received): data['paid'] = invoice.received/1e8 if (int(invoice.btcvalue) &lt;= int(invoice.received)): data['path'] = invoice.product.product_image.url else: data['paid'] = 0 return render(request,'invoice.html',context=data) </code></pre> </div> <h3> Invoice Page Front End </h3> <p>In the frontend, we have displayed all the data we get from <code>track_invoice</code> view. But, when the transaction status gets updated, how will the buyer know about it? <br> To address this issue, we can either continuously pool our database to get the recent status of this invoice or we can use the WebSocket provided by Blockonomics. It is <strong>HIGHLY</strong> recommended to use WebSocket as continuous polling may have serious effects on system performance. Blockonomics pushes the status update through websocket as well, so your frontend will instantaneously know the changes, so you know that your page is now outdated. At this point, you can either reload the page to get recent data from <code>track_invoice</code> view or use AJAX calls to do the same. It is recommended to use a time out of 1 second, because <code>receive_payment</code> view will take some time to update the database with details and once you wait for a while, you are assured that your database is updated and thus you can perform the action.<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>var socket = new WebSocket("wss://www.blockonomics.co/payment/"+ address); socket.onmessage = function(event){ response = JSON.parse(event.data); //This condition ensures that we reload only when we get a //new payment status and don't go into a loop if (parseInt(response.status) &gt; parseInt(status)) setTimeout(function(){window.location.reload() }, 1000); } </code></pre> </div> <h2> The End </h2> <p>The video tutorial explaining the entire demo is attached below. In case you have queries, feel free to use the comment section!<br> <iframe width="710" height="399" src="https://www.youtube.com/embed/xGeD1UUXpMk"> </iframe> </p> beginners django javascript python