Hono

Hono is a purpose driven networking platform for high achievers, corporate leaders, and social organizations who want to build authentic relationships and collaborate on initiatives that create positive social impact. Instead of the usual transactional networking, the connection here is built on shared values with the "Give Give Get" philosophy.

My role is as a front end engineer who builds the platform, both slicing (changing the image UI in Figma into html, css, and js code) and integration (consume API, authentication and authorization, routing, empty state, error state, loading state, etc.), and here are the main parts that I worked on.

First, the home feed, where the member can see the posts of their network filtered by topic, see the translation of a post, and interact with it through like, reply, repost, bookmark, and share. Every person is also labelled with the relation to the member (friend, colleague, business partner, mentor, mentee, and so on) so the context of the connection is clear. Continued with the post detail page together with its nested replies and the follow state of the author.

Second, the communities, where the member can explore a community profile with its overview, mission, goals, area of focus, representative, and also its own content that is separated into post, initiative, event, and media.

Third, the member profile, which contains the bio, area of interest, contact, social media, the digital membership card of the member, and the tab of their post, replies, saved, likes, and media.

Fourth, the partner page that shows the profile of the partner company together with the benefits that the member can claim, and the activity and notification page that groups all the activity by time period.

All of it is built with Nextjs using Server Side Rendering, so the page loads fast and stays SEO friendly even though the content is very dynamic.

NB: Source code cannot be shared because it is a company asset.

Technologies
See the result on
unofficial/hono/home-screen.png
unofficial/hono/post-details-not-followed.png
unofficial/hono/communities-community-profile.png
unofficial/hono/my-account.png
unofficial/hono/partner-detail-page.png
unofficial/hono/notification.png
Hono | Dani Nur Afandi