The main goal of this challenge consists to propose a solution to improve the codebase of two products that has different purposes but some of the elements in UI are the same (e.g. menu items).
Web Orders is a product designed to place orders for take away and delivery.
This project is old and was built in AngularJS.
QikOrder is a product designed to place orders for open check (you are a in the restaurant, choose a table, order for this table and then pay when finish).
This project is recent and was built in ReactJS.
Basically I expect to see a solution that will reuse components/elements in both products.
Let’s take the menu item as example:
- It has the same styles in both products
- It's an AngularJS component on Web Orders product
- It's a React component on QikOrder product
We expect a proposed solution to reuse components on those 2 products in a way we can start building and changing it as it is today.
They are 90% similar, with similar journey, similar UI. But as they are separated products to end customer, we have built it twice and we are wondering how we could write components once and reuse in those 2 products.
Those 2 products are already in production currently, so please be carefully of how you are planning to reuse components.
Do the best you can. I'm not asking you to build the solution, i'm asking you to propose a solution.
So write diagrams, write texts, open PRs with examples of how it could be done.
- Please fork this repository on your account to add diagrams and invite ronaldo.zanoni@qikserve.com, felipe.loge@qikserve.com and caio.ricci@qikserve.com. *