This week my team started to develop a rough overview of our project. Oh yeah! I should probably share what we are working on before I get into our plan. We are going to make a “dating” web app for pets and prospective adopters, more specifically, it’s an app that allows users to look for pets to adopt that are posted up by local shelters. So, get ready to swipe right on all the cute doggos (and other animals too).
So, how did we start planning this web app out? Our main goals during this phase were to determine what API’s and technologies we are going to use and get a rough idea of how they are going to work with each other, come up with a schedule/overview of what project related tasks each person on our team will be responsible for, and generate some graphical representations of our app layout/functionality.
With regards to technologies used, we already know that our main tech stack is going to be MERN. This stands for MongoDB, Express, React, and Nodejs and will be able to handle our back-end server, and front-end website. The diagram below gives a rough idea of how everything works together. Luckily most of our team has had some degree of experience with some or all of these technologies. However, we added an extra goal to our planning phase to have everyone spike the stack to familiarize themselves with it, and also to gather resources to be shared with everyone (tutorials, examples etc) so we can all learn/refine our skills together.
The MERN stack covers most of our bases on making the base version of our app. However, if we start looking at making it a little fancier (stretch goals) by adding a news feed for users and a fancy rotating image gallery for our pet pages it becomes a little more complicated. For example, to implement a news feed using an asynchronous queuing system like RabbitMQ might be better than trying to implement it with just MERN technologies, additionally what about if we want to add a fancy rotating image gallery to our pet’s profile pages? Should that be a separate service that we write to not over complicate our code, or should we just implement it with some CSS black magic?
We haven’t made any hard decisions on implementing stretch goals as of writing this. We have a team meeting on Friday and part of our individual tasks to prepare for that was to look into how to implement our stretch targets so we can have a group discussion orbiting our findings and come up with a plan together. I’m looking forward to see what my teammates come up with!
As far as planning out the rest of the quarter and delegating a set of tasks to everyone on the team, we will also do this at our Friday meeting. As alluded to above, we wanted to give everyone a moment to acquaint/reacquaint themselves with the MERN stack and make a final list of projected technologies to be used before we made any hard calls on divvying out tasks.
For our graphical representations, we decided to create a very rough digital paper prototype of the web app using Figma. Note that we aren’t linking any of the frames just, we are simply using it as drawing tool. We agreed in our last meeting to use this as a flexible jumping off point to how things will be laid out.
Finally, we needed a way to keep everyone organized and on track as we start ramping up our work. We agreed to use Trello to create a Kanban board which we will use to track our short and long term goals once our initial project plan is agreed on and in place.
Sources
- https://www.tecla.io/blog/the-inside-scoop-on-mern-stack/
