Overview

daily-HUD(Heads Up Display) is a daily dashboard for the crypto trader on-the-go. Using dailyHUD, you can get all of the information you need to start your day, in one convenient spot.

Table of Contents

• About this project
• User Stories
• Technologies
• Links
• Installation

---

About the Project

daily-HUD is a fully rendered, interactive, mobile first app that allows users to learn more about the weather, details about different cryptocurrencies, and the current state of the fear-and-greed index. This project was an exercise in:

• Mobile First Methodology
• Pixel Perfect Design Implementation
• Making API calls to 3 seperate sources for data
• Securely passing API keys to their sources
• Rendering conditional styling to the user based upon user input
• Proper use of useState and useEffect Hooks
• CSS custom properties & CSS modules in React
• Semantic naming conventions
• Flexbox
• CSS Grid
• React.js

Home Page

Mobile Preview

Desktop Preview

(The Desktop view is in development.)

User Stories

As a user of daily-HUD, I would like to be able to:

• View the optimal layout depending on their device's screen size
• See different data visuializations depending on the states for interactive elements
• View the weather data by geolocation and by zipcode
• View the current price and the 24 hour trend in Bitcoin, Ethereum, and Cardano
• View the current state of the Fear & Greed index which is updated dynamically one time daily.

# Technologies

Front End Languages
Frameworks & Libraries
Design
Utilities
Workflow
Deployment

---

Installation

Download the repo using git
git clone https://github.com/CrowdedAstronaut/daily-hud.git

Navigate into the site's directory and install dependencies.

cd daily-HUD/
yarn install

Start the Server.

yarn start

Open the source code and start editing! Your site is now running at http://localhost:3000!

Links

• GitHub URL: Github
• Live Site URL: Live Site