50lbs of flare in a 10lb app! (๐Ÿ‘€)

50lbs of flare in a 10lb app! (๐Ÿ‘€)

Contacts Maxx takes the foundational structure from a typical Remix contacts app and elevates it to new heights. This vibrant, feature-rich application not only allows users to keep track of their contacts but also enriches daily life management through a multi-feature dashboard. Users can indulge in daily wisdom quotes, chuckle at dad jokes, organize their to-do list, explore weather patterns, dive into current news, and moreโ€”all within a visually stunning interface.

contacts1-1
contacts3
contacts4
contacts5
contacts6

Features

  • Contact Management: Keep track of all your important contacts in one place.
  • Multi-Feature Dashboard: Access a variety of tools from your dashboard:
    • To-Do List: Stay on top of your daily tasks.
    • Wisdom Quotes: Receive daily nuggets of wisdom.
    • Dad Jokes: Lighten the mood with a constant supply of dad jokes.
    • Photo Album: Browse through your favorite memories.
    • Weather Search: Stay informed about the weather in your area.
    • News Component: Keep up with the latest headlines.
  • Visually Brilliant: Enjoy a stunning and user-friendly interface designed to please the eye.
  • Responsive Design: Fully functional across devices of all sizes.

Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

  • Node.js (preferably the latest LTS version)
  • npm (comes installed with Node.js) or Yarn
  • A browser to view the app

Setup

  1. Generate the basic template:

    npx create-remix@latest --template ryanflorence/remix-tutorial-template
    

    This uses a bare-bones template but includes our Chakra UI and data model, focusing on Remix. Check the Remix Quick Start for a basic setup of a Remix project.

  2. Start the app:

    # Navigate into your directory where you've unzipped the app
    cd path-to-your-app
    
    # Install dependencies
    npm install
    
    # Start the development server
    npm run dev
    

    You should now be able to open http://localhost:3000 and view your app locally.

License

This project is licensed under the MIT License

Acknowledgments

  • Hat tip to ICanHazDadJokes!!
  • Special thanks to the Remix team for their amazing work!