{"id":29113543,"url":"https://github.com/youhad08/product-management-system.","last_synced_at":"2026-04-11T17:05:11.796Z","repository":{"id":301817233,"uuid":"1010391948","full_name":"YOUHAD08/product-management-system.","owner":"YOUHAD08","description":"🛒 A full-stack product management app built with Spring Boot (REST API backend) and Angular (frontend). Manage products with view and delete features using an in-memory H2 database.","archived":false,"fork":false,"pushed_at":"2025-06-29T01:33:47.000Z","size":349,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-06-29T02:40:30.511Z","etag":null,"topics":["angular","backend","bootstrap","crud","css","frontend","full-stack","h2-database","html","java","javascript","maven","product-management","rest-api","spring-boot","typescript","web-application"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","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/YOUHAD08.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,"zenodo":null}},"created_at":"2025-06-29T01:04:19.000Z","updated_at":"2025-06-29T02:03:09.000Z","dependencies_parsed_at":"2025-06-29T02:40:40.877Z","dependency_job_id":"4ab45912-0397-4aff-a182-09c05e95cbde","html_url":"https://github.com/YOUHAD08/product-management-system.","commit_stats":null,"previous_names":["youhad08/product-management-system."],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/YOUHAD08/product-management-system.","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/YOUHAD08%2Fproduct-management-system.","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/YOUHAD08%2Fproduct-management-system./tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/YOUHAD08%2Fproduct-management-system./releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/YOUHAD08%2Fproduct-management-system./manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/YOUHAD08","download_url":"https://codeload.github.com/YOUHAD08/product-management-system./tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/YOUHAD08%2Fproduct-management-system./sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":262581374,"owners_count":23331913,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["angular","backend","bootstrap","crud","css","frontend","full-stack","h2-database","html","java","javascript","maven","product-management","rest-api","spring-boot","typescript","web-application"],"created_at":"2025-06-29T11:05:38.617Z","updated_at":"2025-10-14T13:34:14.179Z","avatar_url":"https://github.com/YOUHAD08.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🛒 Product Management System\n\nA full-stack web application for managing products, built using **Spring Boot** for the backend and **Angular** for the frontend. It allows users to view, delete, and inspect products, with data stored in an in-memory **H2 database**.\n\n---\n\n## 📸 Screenshots\n\n**Home Page**\n\n![Home Page](img/home-page.png)\n\n**Product Page**\n\n![Product  Page](img/product-page.png)\n\n**H2 DataBase**\n\n![H2 DataBase](img/h2-database1.png)\n![H2 DataBase](img/h2-database2.png)\n\n---\n\n## 📸 Tech Stack\n\n| Layer    | Technology                     |\n| -------- | ------------------------------ |\n| Frontend | Angular 17                     |\n| Backend  | Spring Boot 3                  |\n| Database | H2 (In-memory)                 |\n| Language | Java 17, TypeScript            |\n| Tools    | Maven, Angular CLI, H2 Console |\n\n---\n\n## 📂 Project Structure\n\n**Front End (Angular)**\n```\nproduct-management/\n├── img/\n├── node_modules/\n├── public/\n├── src/\n│   └── app/\n│       ├── home/\n│       │   ├── home.css\n│       │   ├── home.html\n│       │   ├── home.spec.ts\n│       │   └── home.ts\n│       ├── products/\n│       │   ├── products.css\n│       │   ├── products.html\n│       │   ├── products.spec.ts\n│       │   └── products.ts\n│       ├── services/\n│       │   ├── product.spec.ts\n│       │   └── product.ts\n│       ├── app.config.ts\n│       ├── app.css\n│       ├── app.html\n│       ├── app.routes.ts\n│       ├── app.spec.ts\n│       └── app.ts\n├── index.html\n├── main.ts\n├── styles.css\n├── .editorconfig\n├── .gitignore\n├── angular.json\n├── note.txt\n├── package.json\n├── package-lock.json\n├── README.md\n├── tsconfig.app.json\n├── tsconfig.json\n└── tsconfig.spec.json\n\n```\n**Back End (Spring Boot)**\n\n```\nProduct-REST-API/\n├── src/\n│   └── main/\n│       └── java/\n│           └── ma/\n│               └── youhad/\n│                   └── productrestapi/\n│                       ├── ProductRestApiApplication.java\n│                       ├── entities/\n│                       │   └── Product.java\n│                       ├── repository/\n│                       │   └── ProductRepository.java\n│                       └── web/\n│                           └── ProductRestAPI.java\n│\n├── src/\n│   └── main/\n│       └── resources/\n│           ├── application.properties\n│           └── static/\n│\n├── mvnw\n├── mvnw.cmd\n├── pom.xml\n└── README.md\n\n```\n\n---\n\n## 📸 Backend - Spring Boot\n\n### Main Features:\n\n**Backend (Spring Boot REST API)**: [View Backend Repository](https://github.com/YOUHAD08/product-management-system--backend.git)\n\n- RESTful API using @RestController \n- JPA Entity Product with fields:\n     - id, name, price, quantity, selected \n- ProductRepository for database operations \n- Auto-populated sample data on startup\n\n| Method | Endpoint         | Description          |\n| ------ | ---------------- | -------------------- |\n| GET    | `/products`      | Get all products     |\n| GET    | `/products/{id}` | Get product by ID    |\n| DELETE | `/products/{id}` | Delete product by ID |\n\n\n### Example JSON Response:\n\n![JSON File](img/json.png)\n\n### H2 Console:\n\n- Access via http://localhost:8080/h2-console\n- Use JDBC URL: jdbc:h2:mem:products-db\n\n---\n\n### 💻 Frontend - Angular\n\n## Main Features:\n\n- Fetch product list from REST API \n- Display product details \n- Delete products \n- Angular service to handle HTTP calls \n- Responsive UI\n\nRuns on http://localhost:4200\n\n---\n\n## ⚙️ Getting Started\n\n### Backend\n\n```\ncd Product-REST-API\n./mvnw spring-boot:run\n```\n### Frontend\n\n```\ncd product-management\nnpm install\nng serve\n```\n\nThen go to: http://localhost:4200\n\n### 🔐 H2 Database Access\n\nAccess URL: http://localhost:8080/h2-console\n\n---\n\n## 🌍 Cross-Origin Configuration\n\nCORS enabled in Spring Boot:\n```\n@CrossOrigin(\"http://localhost:4200\")\n```\n---\n## 🧠 Key Concepts \u0026 What I Learned\n\n- RESTful backend development using Spring Boot \n- Angular client development with service architecture \n- Connecting Angular to Java backend via HTTP \n- Initializing in-memory data with CommandLineRunner \n- Working with @Entity, @RestController, @CrossOrigin, and more \n- Using Angular HttpClient for REST API calls\n\n---\n\n##  📜 License\n\nThis project is licensed under the MIT License.\n\n## 📁 Resources\n\n| Item          | Path or Link                       |\n| ------------- | ---------------------------------- |\n| Frontend Code | `/product-management/`             |\n| Backend Code  | `/Product-REST-API/`               |\n| H2 Console    | `http://localhost:8080/h2-console` |\n| API Base URL  | `http://localhost:8080/products`   |\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyouhad08%2Fproduct-management-system.","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyouhad08%2Fproduct-management-system.","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyouhad08%2Fproduct-management-system./lists"}