react-fixer

react-fixer

react-fixer is a lightweight and customizable React component that allows you to easily fetch historical currency exchange rates using the Fixer API and convert the JSON response to the well responsive Chart UI.

Features

• Fetches historical exchange rates for multiple symbols.
• Customizable through props like API key, symbols, start date, and end date.
• Displays data in a chart format for easy comparison.
• Fully customizable and easy to integrate.

Installation

To install the package, simply run:

npm install react-fixer

If you are using Yarn:

yarn add react-fixer

Usage

Here's a basic example of how to use the react-fixer component in your React project:

import React from "react";
import { HistoricalChart } from "react-fixer";

const App = () => {
    return (
        <div>
            <h1>Currency Exchange Rates</h1>
            <HistoricalChart apiKey="YOUR_API_KEY" symbols="USD,EUR" startDate="2023-01-01" endDate="2023-12-31" />
        </div>
    );
};

export default App;

Props

The HistoricalChart component accepts the following props:

Prop	Type	Description	Required
apiKey	string	Get your API key from Fixer.io.	Yes
symbols	string	An array of currency symbols (e.g., "USD, EUR").	Yes
startDate	string	The start date for fetching historical rates in YYYY-MM-DD format.	Yes
endDate	string	The end date for fetching historical rates in YYYY-MM-DD format.	Yes

Contributing

We are soon opening up the public contribution on react-fixer package. Meanwhile, if you have any suggestions of feedback, feel free to reach me out [e-mail]