Today I would like to demonstrate an example of a custom e-commerce solution development for online store owners who are facing marketing flexibility challenges as a result of their platform limitations.
As an example we are going to look at the case of Bikebiz, one of the largest Australian bike and bike parts retailers who decided to incorporate a mix of newest technologies and lead by example for many merchants.
Bikebiz Motorcycle Platform CMS overview
Intention: Development of easy customizable CMS/e-commerce solution from scratch
Technologies used: Reactjs, Prismic, Magento 2, Google Cloud, Cloudflare, Custom Integrations
People Involved: 5 developers
Timeframe: 4 months
Prehistory of the development
We’d previously written about our journey building Magento 2 e-commerce solution for Bikebiz in this article. And now this journey continues.
The experience of using Magento platform by Bikebiz team had shown that managing marketing content and building custom promotion pages/structures may not be as cost and time efficient as their pace demands.
The team was required to spend a lot of time building custom pages, implementing new layouts and designs, and as a result could not achieve their target results on time.
As a result we’ve found a separate Cloud Content Management System called Prismic, that would simplify the creation and management of such promotional pages. This CMS was quickly wrapped in
a fast and modern React Javascript Framework and a Proof of Concept was presented to Bikebiz board of directors.
It became clear that it fits all the business requirements. Further, we have been working with a product owner and UI designer in one team and prepared comprehensive documentation for a whole React project.
And we started.
Software Development Process and Lifecycle
1. Documenting
Documenting is an important stage after gathering business requirements. It helps to navigate the system as a whole with all it’s relations, integrations and interactions.
Our documentation is usually very typical, we do it in our corporate documentation base Confluence and looks it like this:
In the documentation each UI element’s logic and behavior is described from end-user’s point of view.
When the documentation is completed, a product owner has to review it making their notes and providing approval.
2. Planning
When the documentation is ready, a project manager splits the documentation into tasks, and it looks like this:
Each UI element/piece of the documentation is tied to Jira Project Management Software.
Further planning is conducted by combining these tasks into scrum sprints/process, and working with documentation to see the deliverables of which individual stage.
This helps to not miss anything.
3. Continuous Integration
Developer for each task in Jira creates a new branch in the repository, and this automatically changes the status of the task.
Now, developer is working in their created branch only, coding the automated tests (e.g. Test Driven Development ) and a required component.
When code is ready and all tests are passed, developer pushes code into repository and creates a Pull Request, then all teammates review and approve or comment it.
When a Pull Request is tested by CI, reviewed and approved by the team, developer merges their code into a code base.
CI tool automatically updates a staging server and informs the team in the Slack channel, that it is now available for review on the staging server.
Results
Online an example of our results are available on our public repository: https://github.com/skynixukraine/Magento2-With-React-Example
And on our staging server: https://bikebiz.g-inc.pro/new-bikes/yamaha
Conclusion
All these pieces of software development process may appear too difficult and expensive.
And indeed, this is true, because business software cost a lot, as well as DevOps engineers who can set all this up.
Luckily, for our customers, during last 3 years our engineers worked hard and configured different CI models for typical projects.
So, now, anyone who wants try it, may not pay for software or DevOps services.
Within only 2 hours this all will be set up using corporate Skynix software and Software Development process will begin.