Introduction

2020 has been a very hard year for all of us, we have all faced unique challenges and hardships. From COVID-19, to civil unrest, and plenty of injustice, people all over the world are fighting for a better future. In these unprecedented times, when we are more disconnected and isolated than ever, it is important to be informed of protests and other social movements around the world.

Somo is an intuitive map that displays where social movements are trending around the world. Our goal is to show the public where the support for these movements is coming from and raise further awareness for their cause.

Tech Stack and Tools

Features

Somo is a full stack React application with a Node.js and Express backend. Client side code is written in React and the backend API is written using Express.

Description

Somo provides a detailed description of all major social movements around the world

Map

Our map provides a great view of where in the world a particular social movement is happening

Twitter Feed

The Twitter Sidebar provides the top tweets of the social movement to keep you updated on the latest news

Challenges

In terms of challenges, we had trouble setting up for front-end development but as a team we collaborated and were able to solve a number of issues, one of which had to do with dependencies. APIs are an amazing way for developers to get access to features for an application. However, a challenge we faced was working with unfamiliar API’s and dealing with free account limitations from Twitter, OpenCage and React-Map. By familiarizing ourselves with the documentation and understanding the API limitations, we were quickly able to overcome this challenge.

Development mode

In the development mode, we will have 2 servers running. The front end code will be served by the webpack dev server which helps with hot and live reloading. The server side Express code will be served by a node server using nodemon which helps in automatically restarting the server whenever server side code changes.

Quick Start

# Clone the repository
git clone https://github.com/ashtan19/SoMo.git

# Go inside the directory
cd SoMo

# Install dependencies
npm install

# Start development server
npm run dev

Folder Structure

All the source code will be inside src directory. Inside src, there is client and server directory. All the frontend code (react, css, js and any other assets) will be in client directory. Backend Node.js/Express code will be in the server directory.

Future Developments

  • Implement interactive markers on the map to display number of tweets & country
  • Zoom function where the user can look at smaller countries in more detail
  • Filter inappropriate and irrelevant tweets
  • Auto generate trending hashtags and filter based on relevance
  • Have links to learn more or donate to support causes
+ 26 more
Share this project:

Updates