Git Product home page Git Product logo

buffer-ui's Introduction

harshalmaniya2

Buffer Finance

Decentralized Trading Platform

To run this project locally

  • Install Dependencies yarn install
  • Configure App Either Create a file named .env.local with content: VITE_ENV = MAINNET VITE_MODE = developement BASE_PATH = public
    OR
    Rename .env.sample -> .env.local
    *You can set VITE_ENV to TESTNET also.
  • Start Developement Server Run yarn dev from terminal
What we used for
  1. Wallet Connection
  2. For wallet connection we used RainbowKit. It provides a cleaner interface for connection while hiding the sheer complexities (different wallet providers, Network not present, Handling Connection states etc…) involved in wallet connection.
  3. Contract Interaction
  4. For this we used wagmi hooks.
    • For executing Write-Calls We specifically used this hook to create a ethers.js like contract instance in this service For Read-Calls We have a specific requirement to use the user's wallets injected connector’s rpc for read calls if connected. We also used swr for caching and revalidating data. These 2 things are implemented inside this service,
    • For executing Read-Calls. We have a specific requirement to use the user's wallets injected connector’s rpc for read calls if connected. So we implemented our own service using swr.
  5. Trading View
  6. How we integrated it:
    1. Get access to their widget’s github repo by clicking on “Get Library” under Technical Analysis Charts section from here
    2. Copy/Paste there static/charting_library folder into your project’s public directory.
    3. Integrate there static files into you dynamic react component - They have one example with plain old React’s Class Based Components but we are heavily using Functional Components and custom hooks in our repo. So we converted there example into Functional Components. You can have a look at integration from here.
    4. Write a JS-API which serves as a data-feed for your TradingView. This API should contain 5-6 mandatory methods which TradingView expects us to implement. We named that as a datafeed here
    5. Visualise positions using their APIs - Code is in same file.
    6. Implement an auto-save mechanism for drawings on TradingView.

Connect with us on

twiiter link twiiter link

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.