Masai Collaboration Project — Twitter Clone

Firstly, we would like to express our heartfelt gratitude to MASAI SCHOOL for giving us the opportunity to work on this project. We have tried our level best to make use of our journey and the knowledge that we have gained so far at Masai School to come up with our first big project, that would never been a reality without the constant guidance and support of the faculty members and our mentors.

Let me tell you about the project what it was all about and how we managed from the beginning to the end.

Our Journey…

We must say it was a roller coaster ride full of ups and downs. We disagreed a lot and there were conflicts of perspectives but at the end of the day, we were very excited to showcase and deliver our project.

During the build week, we used to have stand up meets in the morning as well as in the evening with our mentors, in which we used to plan the things for the day, fix the bugs, and report the progress.

Communication is important for every team, but it should be a top focus when people are not co-located. Our communication medium was mainly Slack and Zoom.

About the Project:-

Basically, we had to clone the Twitter app. As we all know Twitter is an American micro-blogging and social networking service on which users post and interact with messages known as “tweets”.

We have tried to create a near pixel-perfect clone of the website using React.

And here are the samples how it looks like…

Landing Page:

Login Page:

Home Page:

Profile Page:

How we started:-

We were a team of three people. We started with a Zoom meeting as soon as we were assigned the project and our teammates. In the meeting, firstly we decided on how to proceed, and how would we divide the workload, what might get in the way, what resources we can use, etc.

We started with creating a repository on GitHub, created issues, and assigned them to the respective person and a milestone accordingly.
It helped us a lot in completing the project within the deadline.

Team members:

Jigyasa Kaushik
Shamsher Ali
Aloknath Sah

Roles & Responsibilities:-

Firstly we created a database of users as we did not have access to the API of Twitter.

The landing & Login page was created by Shamsher Ali and was designed by me.

Then comes the Home Page, in which the side-bar was created by me which has the routing part from where we can navigate to different components and pages.

On the right side, there is a widget, that was done by Aloknath.

Further, the Profile and explore page was also created by Alok and Shamsher put his efforts into making the project dynamic.

We can also tweet that is the main functionality of Twitter and it will reflect in the posts which we can like or dislike.

We divided our work equally to complete all pages and functionalities.

Tech Stack:-

React
JavaScript
HTML
CSS

Challenges:-

We had to face some challenges while making the clone. Producing exact layouts was a challenge. It was difficult to make the code work in everyone’s system.
Merging codes was the great challenge that we faced. There were many merge conflicts while pushing codes to GitHub that took much of our time to resolve.
There were also some issues in the responsiveness of the Navigation bar of the Dashboard.
Since we were not co-located, we faced some challenges in communication as well. We had to connect frequently on zoom for small issues.

Initially, we were a bit panicked and worried about how it would be possible, but later on, we were able to cope up with all these.
Our overall experience was very good, and doing Project was the best learning of that particular technology.

Source Code:-

Github: https://github.com/syedshamsher/Hexane

Thanks..!!