This is the frontend application for the DEX (Decentralized Exchange) platform. It allows users to view live price charts of cryptocurrencies and perform token swapping using Ethereum blockchain.
- React: A JavaScript library for building user interfaces.
- React Router DOM: Library for routing in React applications.
- React Chart.js 2: React wrapper for Chart.js library, used for creating charts.
- Axios: Library for making HTTP requests.
- Chart.js: Library for creating various types of charts.
- Chart.js Adapter Date-fns: Adapter for using date-fns with Chart.js.
- Date-fns: Library for manipulating dates in JavaScript.
- Lightweight Charts: Library for creating interactive financial charts.
- Tailwind CSS: Utility-first CSS framework used for styling.
- Sass: CSS preprocessor for adding features like variables, mixins, and nesting to CSS.
- @fortawesome/fontawesome-svg-core: Library for using Font Awesome icons as SVG sprites.
- @fortawesome/free-solid-svg-icons: Font Awesome library for solid icons.
- @fortawesome/react-fontawesome: React wrapper for Font Awesome icons.
- Framer Motion: Library for creating fluid animations in React.
- Web3: Library for interacting with the Ethereum blockchain and smart contracts.
- @walletconnect/web3-provider: WalletConnect library for connecting to Ethereum wallets via Web3.
- Web Vitals: Library for tracking web performance metrics.
- Prettier: Code formatter used for code consistency and readability.
Follow these instructions to get the project up and running on your local machine.
- Node.js installed on your machine
- npm or yarn package manager
- Clone the repository to your local machine:
git clone https://github.com/muhammadshiraz/dex-frontend-react.git
- Navigate to the project directory:
cd dex-frontend
- Install dependencies using npm:
npm install
- Start the development server:
npm start
- Open your browser and navigate to
http://localhost:3000
to view the application.
- View live price charts of cryptocurrencies.
- Perform token swapping using Ethereum blockchain.
- Responsive design for desktop, mobile, and tablet screens.
Check out the live demo of the application here.
Contributions are welcome! Please feel free to submit bug reports, feature requests, or pull requests.
This project is licensed under the MIT License - see the LICENSE file for details.
Feel free to customize and expand upon this README file based on your project's specific needs and requirements.