Skip to content

This repo contains a client / server web application. The client is implemented with ReactJS and the server with C-Sharp. It implements a currency exchange calculator.

Notifications You must be signed in to change notification settings

mdibenedetto/currency-exchange-calculator

Repository files navigation

Description

This is simple currency exchange calculator. The calculator is composed by 2 main layers, a server side applicatin built using ASP.NET Core and a client built usind ReactJS.

Details:

  1. The API infinite number of defined currencies and their exchange rates. The values are defined in the JSON file.

  2. You can consume the API either with browser or with the React application

  3. Allow user to enter the amount to exchange

  4. Display the result.

NB: This project was built with:

  • MAC OS MACHINE
  • Visual Studio Community Edition
  • ASPNET CORE 3.1
  • VS CODE fo MacOS
  • Create-React-App CLI

Basic Requirements

React-App

  • NodeJS
  • npm

ASPNET

  • ASP.NET CORE 3.1

Client structure folder

alt

Server structure folder

alt

Test application

Test Server ASP.NET WebApi

  • go to the folder server
  • start Visual Studio project
  • run the project
  • in your browser, go to the url http://localhost:54128

A default page index.html is shown to help testing the WEB API

alt

The page shows links to test 3 use cases:

  • One link to test the WEB API using slash separated params
  • One link to test the WEB API using url query params
  • One link to test the WEB API using a bad formatted request

Sample response

alt

  • Url query params - 20usd to eur:

http://localhost:54128/api/currency-exchange-calculator/amount/20/baseCurrency/usd/

alt

  • Bad formatted request - FAIL REQUEST

http://localhost:54128/api/currency-exchange-calculator?amount=20&baseCurrency=eur&targetCurrency=BAD_TARGET

alt

Test Client React App

  • go to the folder client
  • use an Ide of your choice or just open the folder with your terminal app
  • first time you need to install the project dependencies, to do that run the command npm i
  • next step require to start the client app by using the command npm star
  • the command will open the broweset so that you can test the app to the url http://localhost:3000/

The react app display the index.html

alt

From this page you can select the base currency, the amount to convert and the target currecy to use as reference for the desired conversion.

Sample response

Sample - 1

Lets say we choose:

  • Base currency = eur
  • Amount - 10
  • Target currency - usd

The clien should show a response as shown below

alt

Sample - 2

Lets say that for any reason the server web api is not working or simply we forgot to run the server.

The clien should show an alert message as shown below

alt

Sample - 3

Smart device view

alt

TODO

Functionalities

  • Add a server side proxy to call a real API which provide currency rate in real time
  • Add a functional to invert BASE CURRENCY to TARGET CURRENCY and vice-versa

Testing

  • Add unit testing both clien and server side
  • Add BDD testing both clien and server side

JSON API WEBSITE REFERENCE

JSON rate

About

This repo contains a client / server web application. The client is implemented with ReactJS and the server with C-Sharp. It implements a currency exchange calculator.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published