[1Ramp] #WeAreOne Development Update

Repository

https://github.com/hapramp/alpha-web
https://github.com/hapramp/Hapramp-Android

1. About WeAreOne

#WeAreOne is our initiative to give all creative communities on Steem a dedicated space across 1Ramp platform (Android and Web). We believe that this will make content more discoverable and will allow people to connect with more creators.

To read more about the feature, visit our previous blog - https://busy.org/@the1ramp/launching-weareone-curie-sndbox-travelfeed-and-more-on-1ramp-web-android.

In this update, we will be sharing how our developers @bxute and @singhpratyush implemented the feature in the Android and Web apps.

2. Implementation Details

The #WeAreOne communities are stored in a centralized manner at our backends. It stores different communities and the members for each of these communities.

The backend provides an API to interact with a combination of this data and the blockchain; allowing to carry out all the essential operations.

2.1. Feature Overview

This feature provides a listing of communities which the users can join and see them in their (and other’s) profiles. Users can also browse feeds for the tags associated with the communities. To keep the system flexible, each member is assigned a role when joining the community. For now, this is default to “member” only but later on, this can be used to define moderators, maintainers, etc. for a community.

2.2. API Endpoints

As mentioned earlier, the backend APIs provide various ways to play with the data related to communities and the blockchain.

Here are the endpoints available for the end users from this feature -

2.2.1 Get all communities

GET /micro-communities/

This endpoint lists all the communities present on the platform and with all the data related to it like ID, name, tag, image URL, description and a parent community (interest). The tag is later used to carry out all the major operations related to the community.

2.2.2. Join a Community

POST /micro-communities/{tag}/join

This endpoint requires the 1Ramp AUTH Token for the user as an Authorization header. On success, this community would appear in the user’s profile.

2.2.3. Leave a Community

DELETE /micro-communities/{tag}/join

This endpoint also required the AUTH token. On success, this community would be removed from the user’s profile.

2.2.4. Get Posts for a Community

GET /micro-communities/{tag}/posts/{order}

This endpoint returns posts for the requested order. Pagination is supported for this endpoint -
limit: Max number of posts
start_author: author for the last post in the previous list
start_permlink: permlink for the last post in the previous list

The “order” can be anything from “created”, “hot” and “trending”.

We are planning to add an order option called “voted” in order to fetch the posts that are upvoted by the main account of the community. This would help us in building a better feed for a community.

2.3. Implementation in Web App

The web app fetches a list of all the WeAreOne communities using the API mentioned above. This data is then used to render the “Communities” widget in the right of the home screen.

2.3.1. The Communities Widget

The data from API is fetched and stored in the microCommunities reducer. It is then used by the widget component to render all the communities. The component is a functional one which fetches all the communities as a one-time side-effect and renders it in a chip-form.

On clicking, the chip redirects to the community page which is an exclusive spot for the community in the app.

2.3.2. The Community Page

The community page has two main components - info sidebar and posts.

All data present in the info sidebar comes from the backend APIs. It contains a button to join/leave the community. On clicking the button, the corresponding backend API is called and then the user state is updated - hence rerendering the required button.

The posts section contains posts for a given community - sortable by Trending, New and Hot. React hooks are used to handle the logic for changing the tabs and calling the corresponding APIs to fetch the posts.

const [tab, changeTab] = useState('trending');

 () => {
   fetchPosts(tag, tab);
 },
 [tab, tag],
);

The second argument here ensures that the APIs are called only when either tab or tag (or the current community) changes. After fetching the posts, it is stored in the redux state from where the component fetches and displays them.

2.3.3. Pull requests

https://github.com/hapramp/alpha-web/pull/88
https://github.com/hapramp/alpha-web/pull/92

2.4. Implementation in Android App

2.4.1 Communities on Home Page

The App fetches community list from our server and renders in a horizontally scrollable list on the home screen.

The list displayed depends upon the currently selected interest.
If a user selects Travel then only communities of travel are shown.

Explore and Feed section we show all the communities in a combined fashion.

A user can tap on any text and navigate to Community Page.

2.4.2. The Community Page

While in the home page, app fetches all the community list with all its properties.
On clicking any community, details are passed to Community Page.
This page contains basic details of a given community.
By pressing the Join Button, users can be a part of any community.

2.4.3 Community in the user profile section

Each user on the 1Ramp app has a customized profile and its publicly available for exploration.
User joined communities are shown in user’s profile section.

2.4.4 Posts of a community

In this basic release of #WeAreOne, we are only showing posts in a separate tab POSTS.
This section contains 3 types of list
Trending | New | Hot
Upon selection, posts are filtered accordingly.

So any user on the platform can browse through posts of a particular community.

With this update in the app, there were a couple of bug-fixes which improves the user experience.

2.4.5. Pull requests

https://github.com/hapramp/1Rramp-Android/pull/251

3. What’s Next?

Communities on Steem are not limited to #tags and posts. There are real passionate teams of community managers, moderators, curators, delegators, and creators behind them. In the next update, we'll come up with improved representation of communities.

3.1. Help us discover more communities and popular hashtags on Steem

Get your community listed

Fill up the above google form and we'll reach out to you to get your community on 1Ramp.

The Internet is noisy and exceptional content is hard to discover. Various community managers and curators on Steem have already taken the hard and ambitious work of discovering and rewarding creators. And we are here to help them by organizing it. More than organizing, 1Ramp is focused on creating tools and features for people to share the creative work they produce in a better way.

If your community (or a specific #tag) belongs to any of the 1Ramp's domains (Art, Dance, Design, Fashion, Film, Literature, Music, Photography, and Travel), you can get it listed on 1Ramp and use this platform as your own, and get the content created by your community featured across all 1Ramp platforms.

3.2. Stay tuned for awesome contests on the platform

Mention Your Favourite Steem Artists in The Comments - #ChristmasGift

We have something very special for you this Christmas. There is an amazing lot of Artists on Steem who keep us all entertained and engaged on the platform. There are musicians, photographers, dancers, designers, storytellers, poets, writers, comedians and so much more.

Christmas is around the corner and what's the better time to give back some love and say thank-you to these amazing people.

It's simple: Just mention your favorite Artists on Steem in the comments section below and we will make cute little custom videos for top 3 Artists. Featuring them and of course, all their fans (you) who mention them.

---

1Ramp is a Steem Powered Social Media platform for creators. On 1Ramp, you can join communities of your interest out of the available eight: Art, Dance, Design, Fashion, Film, Literature, Photography, and Travel and earn rewards for sharing your work with the community. We are on a mission to bring all creative communities on Steem in one place where people can collaborate, grow, and inspire.

1Ramp is Available on Google Play and Web.

---

Join the conversation on our Discord or write us at [email protected]

Twitter | Medium | Instagram | Facebook