Project is implemented using ReactJS(Hooks) library, along with additional libraries such as Bootstrap and SweetAlert2. Application is used for maintenance of pharmacy products.
How it works
In the left side navigation we have two links: Products, About application. By clicking on them we show their respected views on the right.
Clicking on the Products link user is shown a Products view.
Products view displays the list of all the products and display their info: Name of product, Name of manufacturer, price (eur) and formatted expiry date (dd.mm.yyyy).
Clicking on the edit product button of the product from the list the user is routed to the edit page where he can change the properties of the product.
Clicking on the new product button the user is routed to the create page where he can add a new product.
Clicking on a delete product button the user removes the product from the list and that product is no longer available.
Application UI preview and features
When the app starts, router is navigated to ListProduct component, Initial products are stored in localStorage and state (list) of the component is set to those values, then products are listed in the table
Clicking on button Create new product, router will navigate to CreateProduct component Combobox (Select) will be filled with manufacturers (options) from localStorage.
Date can't be in the past, ID must be unique and all input fields are required, otherwise user won't be able to create new product.
After valid input, user will succesfully create new product
Product is added to the localStorage and state (list) of the component is updated, so table wil re-render containing new values (products)
Clicking on Delete button, user will get modal window to confirm delete action
Clicking on Update button, router will redirect to EditComponent. User can't change ID value and he needs to insert valid data again, same as he had to while creating product.
Clicking on About application tab in left sidebar, router will redirect to AboutComponent. Clicking on Source code button, user can see source code of the application on Github.
