Crypto Tracker

a Full Stack demo built with:

NextJS  |  ReactJS  |  TypeScript

Tailwind CSS  |  Next-Auth  |  MongoDB

also implementing: 

RapidAPI  |  Axios  |  Mongoose

bcrypt  |  JSONwebtoken

view the full code on Github: 

Create an account with your credentials or Google OAuth

- Register and Sign In pages are custom made
- Next-Auth is configured to store user info in MongoDB and create a session token
Screenshot of Register Page
Screenshot of Empty Saved Coins Page
Screenshot of Saved Coins Page

Arrive at your dashboard

- It'll look a bit barren at first
- Head over to the search tab to browse and bookmark some currencies
- Keep track of the currencies saved back in this tab
- Conditionally rendered components are based on saved currencies
- useState & useEffect modify the elements and components live in conjunction with internal API routes

Search for currencies

- Search the top coins on the market
- Add or remove as many as you like
- Top 10 coins is the default
- Can be set to 20, 50, or 100 coins
- RapidAPI currencies are stored in their own state
- React hooks manage the changes made without mutating the original API data
Screenshot of Dashboard Search Page
Screenshot of site on a phoneMobile
TabletScreenshot of site on a tablet

also: It's Responsive

- Most content is viewed on mobile or tablet devices
- Screens of all sizes can enjoy this demo