Forex Exchange

The project uses https://tradermade.com/ data.

Demo   |    Used Technologies   |    Notes   |    Project Setup   

Demo

• Project

Used Technologies

• Vue.js 3
• SCSS / CSS 3
• Vite.js
• Socket.io
• 3rd party libraries
  • Highchart
  • vue-select
  • moment.js
  • highcharts
  • currency-symbol-map
  • currency-flags

Notes

• Since the stock market is closed on the weekend, I am showing the data for Friday of that week.
• If the day a year ago was the weekend, I am showing the graph data of the Monday of the next week of that day.
• I show the previous day's data when the stock market is closed on weekdays. (market_open_status rest api)
• Timeseries rest API returns server error for pairs (SAR / USD) and (SAR / XPD). As a result, the graph cannot be rendered.
• There is a maximum of 1 year of graphic data.

Project Setup

• The following variables should be defined in an .env file.

Environment Variables(.env)

• VITE_STREAMING_API_URL
• VITE_REST_API_URL
• VITE_STREAMING_API_KEY
• VITE_REST_API_KEY

Project Setup and Runs

npm install 
npm run dev