Skip to content

A cryptocurrency tracker app built using React and with data pulled from a third-party API which allows one to monitor the latest crypto news and prices

Notifications You must be signed in to change notification settings

kenjiong/Cryptomania

Repository files navigation

Cryptomania - A Cryptocurrency tracker for all crypto traders!

Project Brief

MVP - Minimum Viable Product

  • Use 3rd party API and Airtable
    • Calling an API and displaying the data for the user
    • Use Airtable to store data
  • Use React framework to build the application with at least
    • 5 components
    • 4 props
    • 2 useStates
    • 2 react router routes
    • 1 lifting state, which is used to implement CRUD on the client side
  • Be styled such that the app looks and feels similar to apps used on a daily basis - having a consistent and polished user interface.
  • Be deployed online using Vercel
  • Have full-CRUD single model operations somewhere within the app's features

Timeframe

1 week

Technologies and Tools Used

  • React
  • HTML
  • CSS/Bootstrap
  • JavaScript
  • Git & GitHub
  • Vercel for deployment
  • Insomnia for API testing

Description

Cryptomania is a crypto tracker app where crypto traders can visit to learn more about the latest crypto news and crypto prices. Cryptomania is derived from the word "kleptomania", and the tagline of the website is a play on the word "steal".

The app allows the user to have an overview of 100 cryptocurrencies and to gain more in-depth information on each coin. The app also allows the user to curate a watchlist so that the user can access the coin of interest quickly, regardless of which page of the website they are currently on. The user can also get the prices of coin in various fiat currencies, as well as the value of a coin in terms of other coins.

Screenshots

Main Page

Main Page

Coins Page

Coins Page

Coin Info Page

Coin Info Page

Coin Converter Page

Coin Converter Page

Planning

Initial Wireframe

Initial Wireframe

Trello Board - User Stories

The Trello Board for Cryptomania can be accessed at: https://trello.com/b/iQptbsAM/cryptomania

Trello Board

Deployment

The website is deployed on Vercel, and you can visit Cryptomania here: https://cryptomania-kenjiong.vercel.app/

Future Developments/Improvements

  • Implementing a portfolio function where a user can store their own portfolio and track how it is doing
  • Implementing charts on the coin information page to visualise price trends
  • Links to markets and sorting by trading pair/exchange
  • Colour indicators for price changes

Acknowledgements

I would like to thank Simon and Joanna for their advice and guidance throughout this project. Through this process, I was able to gain a better understanding of working with the various tools that I have learnt.

Summary and References

This is my first project using React after learning React for the first time just 2 weeks prior to starting the building of the website. I also had a shorter timeline to create a working app as I decided to use a different API and create a totally new app from what I initially had started on. Nonetheless, React turned out to be the more straightforward part - CSS was the real beast waiting to be conquered. It really took a lot more effort than what I thought was required to make the website look like an everyday app.

API and Icons

CoinStats API
Cryptocurrency icons created by GOWI - Flaticon
News Icon created by dickpra - Flaticon
Eye Icon created by Vectors Market - Flaticon

Bootstrap Docs
Table Colours in Bootstrap

About

A cryptocurrency tracker app built using React and with data pulled from a third-party API which allows one to monitor the latest crypto news and prices

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published