sootheR

SUMMARY

sootheR is a news reader for relevant articles with an intuitive user interface to promote soothing and comforting random quotes to offset negative emotions brought on by pandemic updates.

Major Features

• Search for any topic through NYT articles
  • articles with images generate on display cards
    • clicking on title takes user to new window with NYT article
    • image thumbnail renders with associated article
    • url available for view on corner of screen as user hovers over title
    • feature to add articles to "Read Later" sidebar panel
  • articles retrieved without images displayed in Other Search Results at base of page
  • user input search field automatically clears once an article search is performed
    • search arrays generated are cleared before next search is rendered
    • UI elements are emptied when user searches for next article topic
  • random quote generated on header background
    • set to a 5 minute timer function to promote soothing tranquility while reading news
  • "Read Later" article list on sidebar
    • articles added through user clicking a button to save
      • color transitions for buttons and articles when hovered
    • articles can be removed on click
    • persistent storage of articles and search terms
  • Dynamic elements generated with searches and saved articles
  • Successful deployment of mobile application with pleasant aesthetic view

Awaiting Deployment

• Accordion card when article is clicked for reading
• Search bar update on mobile deployment for specific viewports

Technologies Used

• Language(s): HTML, CSS, Foundation, JavaScript, jQuery

Resources

• API(s):

  • New York Times Article Search API
  • Forismatic API

• Graphic Souces:

  • Search by Fahmi from the Noun Project