Skip to content

Latest commit

 

History

History
62 lines (47 loc) · 4.03 KB

README.md

File metadata and controls

62 lines (47 loc) · 4.03 KB

The EventHorizon App

User Interface:

The EventHorizon App Interface

Overview:

The EventHorizon App is a countdown timer application designed to help users anticipate and count down to significant events in their lives. Whether it's a predefined event like New Year's Eve or a custom event, such as a birthday or an anniversary, this app has you covered.

Features:

  1. Predefined Events: Comes with a set of predefined events like New Year, Lunar New Year, and more.
  2. Custom Events: Users can set their own events with a name and date.
  3. Automatic Event Update: For some predefined events, once the date has passed, it automatically updates to the next year.
  4. Local Storage: Remember the last event viewed, so when a user opens the app again, it displays the previously viewed event.
  5. Dynamic Backgrounds: Alternates between different background images, providing a fresh look each time you open the app.
  6. Responsive Text Color: Depending on the background, the text color adjusts for better readability.
  7. Inspiring Quotes: Displays a random inspiring quote above the event title each time the app is loaded.
  8. About Page: Provides more information about the app and its developer, with quick links to the developer's GitHub, LinkedIn, and Gmail.
  9. Mobile Friendly: Optimized for mobile devices, so you can use it on the go.
  10. Editable Custom Events: Users can edit the name and date of their custom events.

How to Use:

  1. Selecting an Event: Use the dropdown to select a predefined event or create a new custom event by entering its name and date.
  2. Deleting Custom Events: Added an event by mistake? No worries, you can easily delete it from the custom events list.
  3. Check the Countdown: Once an event is set or selected, the app will display a countdown timer, counting down days, hours, minutes, and seconds to the event.
  4. Know More: Click on the 'About' button at the bottom to learn more about the app and the developer.
  5. Edit Custom Events: Click on the 'Edit' button at the bottom to edit the name and date of your custom events.

Technologies Used:

  1. HTML5: For the structure and layout of the app.
  2. CSS3: For the styling and design of the app.
  3. JavaScript: For the functionality and interactivity of the app.
  4. Vue.js: For the dynamic rendering of the app and the reactivity of the data.
  5. Local Storage: To store the last event viewed and the custom events added by the user.
  6. Unsplash API: To fetch random background images for the app.
  7. Quotes API: To fetch random inspiring quotes for the app.
  8. GitHub Pages: To host the app and make it accessible to everyone.
  9. Babel: To transpile the JavaScript code for compatibility with older browsers.
  10. ESLint: To maintain a consistent code style and quality.
  11. Prettier: To format the code for better readability and maintainability.
  12. Docker: To containerize the app for easy deployment and scaling.

Setup:

  1. Clone the Repository: Use git clone https://github.com/hoangsonww/EventHorizon.git to clone the repository.
  2. Open in Browser: Navigate to the project directory and open the index.html in your favorite browser.
  3. Contribute: Feel free to fork the repo and make your own changes. Pull requests are welcome!
  4. Report Issues: If you find any bugs or issues, please report them [here](
  5. Contact: For feedback, collaboration, or inquiries, reach out through GitHub, LinkedIn, or Gmail.

Credits:

Developed by Son Nguyen Hoang in 2023-2024. For feedback, collaboration, or inquiries, reach out through GitHub, LinkedIn, or Gmail.

Stay inspired and keep looking forward to the horizon of events in your life! 🌅🕰️