{"id":23301525,"url":"https://github.com/edwinabdonshayo/xkool-eshop","last_synced_at":"2026-04-17T01:32:01.361Z","repository":{"id":258800159,"uuid":"875566991","full_name":"EdwinAbdonShayo/Xkool-eShop","owner":"EdwinAbdonShayo","description":"The repository for an after school eshop. It is for both students and parents/guardians to purchase extra classes. This application is developed using VueJs","archived":false,"fork":false,"pushed_at":"2024-12-12T14:38:33.000Z","size":4094,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-06T22:19:11.136Z","etag":null,"topics":["css3","fetch-api","get","html5","javascript","js","post","put","vue","vuejs"],"latest_commit_sha":null,"homepage":"https://edwinabdonshayo.github.io/Xkool-eShop/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/EdwinAbdonShayo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-10-20T10:32:16.000Z","updated_at":"2024-12-14T15:50:08.000Z","dependencies_parsed_at":"2024-11-26T06:22:27.084Z","dependency_job_id":"aaa8bd48-142d-4d3e-8a98-47751d4567e5","html_url":"https://github.com/EdwinAbdonShayo/Xkool-eShop","commit_stats":null,"previous_names":["edwinabdonshayo/xkool-eshop"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/EdwinAbdonShayo/Xkool-eShop","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EdwinAbdonShayo%2FXkool-eShop","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EdwinAbdonShayo%2FXkool-eShop/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EdwinAbdonShayo%2FXkool-eShop/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EdwinAbdonShayo%2FXkool-eShop/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/EdwinAbdonShayo","download_url":"https://codeload.github.com/EdwinAbdonShayo/Xkool-eShop/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EdwinAbdonShayo%2FXkool-eShop/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31911458,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-16T18:22:33.417Z","status":"ssl_error","status_checked_at":"2026-04-16T18:21:47.142Z","response_time":69,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css3","fetch-api","get","html5","javascript","js","post","put","vue","vuejs"],"created_at":"2024-12-20T10:13:51.288Z","updated_at":"2026-04-17T01:32:01.345Z","avatar_url":"https://github.com/EdwinAbdonShayo.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"***********************************\n# Xkool eShop\n\n## Overview\nXkool eShop is an online platform designed for students and parents/guardians to purchase extra classes. The application provides a user-friendly interface to browse available programs, manage a shopping cart, and complete the checkout process.\n\n## Features\n- **Program Browsing**: Users can view a list of available programs with details such as title, description, price, and available spaces.\n- **Search and Filter**: Users can search for specific programs and filter results by category (e.g., Sports, Music, Arts, Education).\n- **Sorting Options**: Users can sort the program list by name, price, or rating in ascending or descending order.\n- **Shopping Cart**: Users can add or remove programs to/from their cart and view a summary of their selected items.\n- **Checkout Process**: Users can provide their details (name, phone, address, city) and place an order.\n- **Responsive Design**: The application is designed to be responsive and works well on various devices.\n\n## Technologies Used\n- **Frontend**: Vue.js for reactive UI components.\n- **Backend**: RESTful API (hosted at `https://xkool-eshop-backend.onrender.com`) for handling program data and order processing.\n- **Styling**: CSS for layout and design, with Font Awesome for icons.\n\n## Getting Started\n\n### Prerequisites\n- A web browser (Chrome, Firefox, etc.)\n- Internet connection to access the backend API.\n\n### Installation\n1. Clone the repository:\n   \u003ebash code\n   ```\n   git clone https://github.com/EdwinAbdonShayo/Xkool-eShop.git\n   ```\n2. Navigate to the project directory:\n    \u003ebash code\n    ```\n    cd Xkool-eShop\n    ```\n3. Open index.html in your preferred web browser.\n\n### File Structure\n    Xkool-eShop/\n    │\n    ├── README.md                # Project documentation\n    ├── index.html               # Main HTML file\n    ├── Scripts/                 # Directory containing JavaScript files\n    │   └── script.js            # Vue.js application logic\n    └── Styles/                  # Directory containing CSS files\n        └── styles.css           # Styling for the application\n\n## Usage\n\n### Hosted App\n* This is implementation is hosted to a github page corresponding to this repository\n    [Link to the Hosted App](https://edwinabdonshayo.github.io/Xkool-eShop)\n* The application backend is hosted on a github repository at: \n    [Link to the Github Backend](https://github.com/edwinabdonshayo/Xkool-eShop-Backend)\n\n### Actions on the App\n1. **Browse Programs**: Upon loading the application, users can view all available programs.\n2. **Search for Programs**: Use the search bar to find specific programs by name.\n3. **Filter Programs**: Select a category from the dropdown to filter the displayed programs.\n4. **Sort Programs**: Choose a sorting option to reorder the program list.\n5. **Add to Cart**: Click the \"Enroll\" button to add a program to your cart.\n6. **View Cart**: Click on the cart button to view selected programs and proceed to checkout.\n7. **Checkout**: Fill in the required details and click the \"Checkout\" button to place your order.\n\n\n## Code Explanation\n### Vue Instance\nThe application is built using Vue.js, where the main Vue instance is defined in `script.js`. Key properties and methods include:\n\n- **Data Properties**:\n\n    - `appUrl`: Base URL for API requests.\n    - `cart`: Array to hold items added to the cart.\n    - `programs`: Array to store available programs fetched from the backend.\n    - `order`: Object to hold user details for the checkout process.\n\n- **Methods**:\n\n    - `addItemtoCart(program)`: Adds a selected program to the cart.\n    - `removeFromCart(program)`: Removes a program from the cart.\n    - `submitCheckOut()`: Validates user input and sends order data to the backend.\n### API Integration\nThe application interacts with a backend API to fetch program data and submit orders. Key API endpoints include:\n\n- `GET /programs`: Fetches the list of available programs.\n- `POST /orders`: Submits an order with user details and cart items.\n- `PUT /programs/{id}`: Updates the available spaces for a specific program after an order is placed.\n\n\n### Acknowledgments\nVue.js for providing a powerful framework for building interactive user interfaces.\nFont Awesome for the icon library used in the application.\n\n*****************************************\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fedwinabdonshayo%2Fxkool-eshop","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fedwinabdonshayo%2Fxkool-eshop","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fedwinabdonshayo%2Fxkool-eshop/lists"}