The story of our very first collaboration.
When we hear the word collaboration, we always remember our final year projects from the college, where we built advanced things related to Machine learning, AI, and many more buzzing technologies where all we had to do was just go to GitHub and clone down the project to our personal computers and be proud of our work and group effort in copying someones work end to end. And learn anything.
After my college ended and not learning anything for years, I was looking for something that could help me gain some skills and finally land a job. The kind of teaching and learning I had gone through in my college had not been up to the mark so I was skeptical about every institute and every teacher around me. So I started searching on google for something that could help me out. One fine day I found a website which said: “pay after you earn”. It got me interested and began digging in and in the month of September 2020, whilst we were moving towards the Covid’s first anniversary. I decided to take a leap of faith and join Masai School. So here is my story after a month at Masai School.
Concepts we learned in our first unit
Our campaign started on the 19th of October, we were introduced to the ground rules and a new way of life. Week one was all about an introduction to the school and an introduction to the basics of git and Linux commands. Then came week two where we were thought javascript basics like data types, conditional statements, arrays, and other programming basics. Week three was all about the Html, CSS, and creating static layouts with tables and floats. In week four we learned about box models, CSS Grids, Flex, combinators, etc. It was all smooth sailing until we were taught DOM manipulation, now we had to create a layout using javascript, not just create even make them behave as asked. It was tough in the beginning later we got used to it. And at the end of this unit, we learned more about git collaboration, merging, and javascript events.
Project statement and expectations
Build a clone of the website known as SmatBot.
SmatBot is a company that develops software related to Artificial Intelligence. Like every other AI company, their website was Aesthetically pleasing and beautiful if you look at it through the eyes of a visitor, but when you look at it as a developer who had to develop the same thing, it was challenging.
The website was huge and we had to decide upon the number of pages we were going to clone as we had just 4 days to complete this project. So we decided upon 6 pages but ended up doing 5 pages and letting of one page due to time constraints.
Roles and responsibilities
My team was named Nickel. It had three members that are Ranjeet Singh, Suraj Kumar, and myself. We had to distribute the work depending upon the knowledge and skills of each person, so we had a meeting and we shared our strengths and shortcomings.
The Home page was divided into three of us and depending upon our abilities we divided the sections, Ranjeet and myself got the major portions where was Suraj was given a comparatively lesser part. Both of my teammates had already declared that DOM manipulation is something that is not their strength, so that came into my list of responsibilities. It took us 2 days to complete the home page and we were left with 5 more pages to complete within 2 days, so here we dropped the plan of the 6th page and reset our goal to a 5-page website, now we had 4 more pages to go. The login page was given to Suraj while the pricing page was equally divided amongst all three of us. The login page which Suraj ended up creating was not what it looks like now, I had to polish it a bit with CSS and add some javascript to make it look like what it is now. Ranjeet developed the Free Trial page and I did the DOM manipulation part for it. In short, Ranjeet was responsible for at least 40% of the sections of the website, Suraj was responsible for like 20% of sections, and I was responsible for the rest of the sections, the DOM manipulation, and the final touch to the CSS.
In the end, we ended up using almost all the technologies taught to us in the first unit tables, floats, grids, flex so on, you name it we have used it.
Challenges faced and how they overcome
We have faced a number of changes during the course of the project. Communication, git issues, division of work are just to name a few.
Our team consists of people who are not much of a talker including myself. Someone had to break the ice and yes that someone was me, so we joined a slack group and started off with the zoom call on the very first day. We set some rules like what naming cases are we going to use and how are we going to push on git and some other basic things but we did not follow any of those things. Because we decided on using Camelcase and ended up mixing Camelcase and snake_case. We suffered from a lack of communication at least for 2 days. After 2 days we knew each other a bit well and was easy to divide the task and collaborate.
The second issue was git, we had no experience of using git merge and one wrong move would mess up our entire project. So we decided to go slow on that part, I was the only one who was handling the merging property to the main branch while others created their own branches and would update their own branches and let the group know if a task was complete. Once they pull the initiated to their respective branch, we would pull it to our personal computers and review it, once approved by all I used to merge to the main branch else the necessary changes were done.
Diving the work was a task in itself as everyone was not able to work on the same level, so we had to divide according to the abilities where some of us got less work to do whiles others had to deal with more work. As a team, I feel it's fair to understand each other's shortcomings and work as a team accordingly but sometimes the workload goes over the limit.
Usage of different technologies and different ways of programming. It was a very difficult task to fix fellow members' code as they have a different style of writing and the technologies used by them were different from what you were using. We tried to communicate as much as we can to find the commonality between our codes and ended up writing classes together that were used by all of us on the website.
Learning Outcomes
- Learned new things in web technologies
- Learned to collaborate using git
- It doesn’t if your teammates are underperformers or overperformers, all that matters is how as a team you will succeed and build a product together.
- Learned that communication is the key to be a successful team.
If you want to visit our GitHub page the link is down below
