Giter Club home page Giter Club logo

neofi's Introduction

NeoFi Frontend -WIP

This project is a UI implementation based on the given design using ReactJS. It includes a first page with a real-time token value display and a second page with a token selector, real-time price display, and INR investment amount estimator.

Live Application-

ScreenShots

image

image

Tech

  • Library - React
  • StateManagement - ContextAPI
  • React Router Dom
  • WebSockets
  • VanillaCSS - StyledComponent helper -Responsive Design
  • Binance API

Installation

To run the project, download or clone the repository and open the index.html file in your browser.

git clone [email protected]:Koushith/NeoFI.git
cd NeoFi-frontend-developer-round-1-assignment
npm start

Usage

  • The first page displays the real-time value of the selected token. The value is fetched from the Binance websocket every second and displayed on the page.

  • The second page displays a token selector dropdown with a search bar. The tokens are fetched from Binance and displayed in the dropdown. The real-time price and logo of the selected token are displayed above the dropdown.

  • The second input box is disabled, and it displays the estimated amount of tokens the user will get based on the amount of INR they enter in the first input box. The estimation is updated in real-time as the user types in the INR input box.

Credits

Token logo images were downloaded from the web and used in the project. Binance websocket API was used to fetch real-time token prices. The design was provided by NeoFi.

Contributing

This is a completed assignment and contributions are not expected.

License

This project is licensed under the MIT license.

neofi's People

Contributors

koushith avatar

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.