The latest articles on DEV Community by farismamnoon (@farisamamnoon). https://dev.to/farisamamnoon 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%2F1474531%2Fe257896a-5513-4ed3-8a18-27b68617b2a4.png https://dev.to/farisamamnoon en farismamnoon Sun, 13 Oct 2024 08:54:10 +0000 https://dev.to/farisamamnoon/memoir-abh https://dev.to/farisamamnoon/memoir-abh <p><em>This is a submission for the <a href="https://dev.to/challenges/pinata">The Pinata Challenge </a></em></p> <p>This web application serves as a straightforward introduction to the Pinata platform. Designed to be easy to use and understand, it showcases the basic functionalities of Pinata for storing and managing files on the decentralized web.</p> <h2> Demo </h2> <p><a href="https://memoir-frontend-tcfj.onrender.com" rel="noopener noreferrer">https://memoir-frontend-tcfj.onrender.com</a></p> <h2> My Code </h2> <p><a href="https://github.com/farisamamnoon/memoir" rel="noopener noreferrer">https://github.com/farisamamnoon/memoir</a><br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>const pinata = new PinataSDK({ pinataJwt: process.env.JWT, pinataGateway: process.env.GATEWAY, pinataGatewayKey: process.env.KEY, }); </code></pre> </div> <p>The <code>pinata</code> instance setup using environment variables.<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>const image = await pinata.gateways.get(cid).optimizeImage(options); </code></pre> </div> <p>These <code>options</code> come from the client which is configured to whatever container the image would be displayed to.</p> <p><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%2Fuploads%2Farticles%2F109bz8k8v23gtdc6lpv9.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%2Fuploads%2Farticles%2F109bz8k8v23gtdc6lpv9.png" alt="Image description" width="800" height="592"></a></p> devchallenge pinatachallenge webdev api