Skip to content

The "Discover Your Zodiac Sign" project is an intuitive and interactive application designed to determine a user's zodiac sign based on their date of birth. Built using HTML, PHP, CSS, and an XML database, this project combines modern web technologies to deliver a smooth and responsive user experience.

Notifications You must be signed in to change notification settings

eryckassis/Portifolio-Anhanguera-2025

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Project: Discover Your Zodiac Sign

Project Overview

This project was developed to help users discover their zodiac sign based on their provided date of birth. It features a simple and interactive interface using HTML, PHP, and CSS, with an XML database to store information about the signs. The project is responsive, ensuring a great experience on both mobile devices and desktops.

Key Components:

  1. Input Form (HTML + PHP):
    Users enter their date of birth in a form. After submission, the system processes the date and identifies the corresponding zodiac sign.

  2. Zodiac Sign Database (XML):
    The data about the signs, including name, date range, and description, is stored in an XML file (signs.xml). This file is dynamically loaded by the program to determine the user's sign.

  3. Visual Styling (CSS):
    The design uses modern CSS with a responsive theme, gradients, soft shadows, and transitions. The styles are optimized to provide a user-friendly and attractive interface.

  4. Responsiveness:
    The project was developed using media queries and best design practices to ensure accessibility across different screen sizes.


How the Project Works

  1. The HTML form, located in the index.php file, collects the user's date of birth.
  2. The form sends the data to the show_zodiac_sign.php file via the POST method.
  3. In the show_zodiac_sign.php file:
    • The date of birth is processed and compared with the date ranges of each sign stored in the XML.
    • If the date matches a range, the system displays the name and description of the zodiac sign.
  4. In case of errors, user-friendly messages are displayed to guide the user.

Educational Explanation of the Project

Structure:

  1. Input Form:

    • A simple form with an input[type="date"] field to ensure the user enters the date in the correct format.
    • Attributes like required and backend validations ensure data reliability.
  2. Date Processing:

    • The PHP DateTime class is used to efficiently and robustly manipulate and compare dates.
    • The logic handles special cases, such as signs that span across the year (e.g., Capricorn).
  3. XML Database:

    • The signs.xml file stores structured data about the zodiac signs.
    • The simplexml_load_file function is used to load and interpret the XML.
  4. Styling and Responsiveness:

    • CSS defines a modern design using CSS variables, gradients, and transition effects.
    • Media queries are implemented to adjust the layout for mobile devices.

Fixes and Improvements Implemented

1. XML File Validation:

  • Issue: The system could fail if the signs.xml file was missing or poorly formatted.
  • Solution: Added checks to ensure the XML is loaded correctly. If not, the system displays a user-friendly error message.

2. Handling Signs That Span Across the Year:

  • Issue: Signs like Capricorn, which span across the year (12/22 to 01/19), were not processed correctly.
  • Solution: Adjusted the logic for these cases by adding one year to the end or start dates when necessary.

3. More Informative Error Messages:

  • Issue: Generic messages made it difficult to diagnose problems.
  • Solution: Detailed messages were implemented for cases such as:
    • Invalid date format.
    • Error loading the XML file.
    • Date of birth outside the expected range.

4. Responsive Design:

  • Issue: The layout was not optimized for mobile devices.
  • Solution: Media queries were added to the CSS to:
    • Adjust margins and spacing.
    • Ensure buttons and inputs are displayed correctly on smaller screens.
    • Improve the experience on devices with lower resolutions.

5. Improved formatDate Function:

  • Issue: The function could fail silently if the dates in the XML were poorly formatted.
  • Solution: Added validation to ensure that dates in the d/m format are processed correctly.

Conclusion

This project is an excellent example of how to combine different technologies (HTML, PHP, CSS, and XML) to create a functional and interactive application. The processing logic has been enhanced to handle special cases, and the design has been adjusted to provide a high-quality user experience. Additionally, the fixes implemented ensure greater robustness and responsiveness of the program.

About

The "Discover Your Zodiac Sign" project is an intuitive and interactive application designed to determine a user's zodiac sign based on their date of birth. Built using HTML, PHP, CSS, and an XML database, this project combines modern web technologies to deliver a smooth and responsive user experience.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published