Over the past several weeks I have been working with a team on our final project, Merchant Marketplace.
The inspiration for this idea came from the desire to create a space for small merchants to market their unique products and complete transactions with interested clients. Ultimately this project is supposed to cover some of the gaps left by sites such as Etsy or Ebay.
Going into this project, I wasn’t sure what to expect. There were no designations for front or back-end developers, instead we were a team of all full-stack developers. Having this type of team meant we could move fluidly between the front and back-end depending on what was required. This was an amazing experience, as each team member was able to contribute to the entire development of a feature. For example, when working on implementing a simple search of our database using SQL in our Node back-end, the same developers could easily jump in and contribute to the development of that search in the front-end.
Additionally, this project would be longer than any I had worked on previously. There was to be a much heavier emphasis on the planning process than I had experienced before. However, I am so glad I got that experience. Our team used Trello to keep everything organized, in one place, and everyone’s progress was in plain view, so there was no confusion about what other tasks were currently being worked on and how far along they were coming. Additionally, we used whimsical to create relational diagrams which we would use to create user stories to add features.
Uncovering Query Strings
In this project, I really wanted to implement query strings for searching through the inventory of our site.I had heard of it before and seen it in the address bar, but I wasn’t sure how to implement it. It turned out it was quite simple.
From the front-end, all they have to do is collect a user search and send that in a GET request to our API like so:
localhost/items/?search=gray+desk&category=2
This is very simple, the “?” signals that this is a query, so from the back-end, we are able to extract the request.query object. This object currently has two keys we defined: search and category. The search key’s value is “gray desk” and the category key’s value is 2.
From here, we can do whatever we want with the search data.
You don’t have to create another route, you just have to implement a way to handle queries if they are present on the request object. In our case, the GET request worked the exact same way as before, returning all items. However, based off of the query, we filter those results down in our database model to try and get the closest matches.
Current State of Merchant Marketplace
Currently our product can search for all items similar to a user’s search, sellers can upload items and edit them, as well as see their own inventory. Beyond this we fixed bugs with migration tables and removed authentication middleware that was crashing the site. Our team was ultimately able to work together to lay a solid groundwork for the next team to build upon.
The Future of Merchant Marketplace
In the future I could see more features added to the front-end in terms of search. This would include searching by category as well as sorting by price high and low. Additionally, Merchant Marketplace will have more time in the future for additional design work which will make it look even better than it does currently. Ultimately, Merchant Marketplace has a lot to look forward to as it approaches production quality.
Check out the code!
