Skip to content

All personal projects

Nocturne Network

A team full-stack web application with a Go backend and a React frontend.

Nocturne Network is a full-stack web application built by a team of four: a Go backend and a React, TypeScript and Vite frontend, run together with Docker Compose.

My role was the bridge between frontend and backend: coordinating integration and keeping functionality and code quality consistent across the project.

Gallery

Nocturne Network sign-up screen, step one of three with a neon SIGN UP title, a progress bar with user, lock and card icons, and username, first name and last name fields — Multi-step sign-up flow

Nocturne Network login screen at phone width, the same frosted card with neon LOGIN title and form fitting a narrow purple starry screen — Login on a phone-size screen

Nocturne Network home feed as a 3D card carousel in a dark neon theme, a text post from mina about a board game night in front with a photo post from omar beside it, a notification badge in the header and group avatars in the bottom bar — Home feed carousel

Nocturne Network feed with a photo post from mina centred, a sunrise hike caption above an orange mountain illustration, with category icons and a reaction and comment bar beneath — A photo post in the feed

Nocturne Network post card flipped to its comment thread, three friendly replies from hassan, yusuf and layla with a heart reaction on one and an add-a-comment field below — Comment thread on a post

Nocturne Network post with the emoji reaction picker open above the reaction button, a row of six reactions and counts below the card — Emoji reactions on a post

Nocturne Network Create a Post modal over a blurred feed, with a filled text box, a drag-and-drop media upload area, Art and General categories selected and a Public privacy toggle — Create-post modal

Nocturne Network notifications drawer sliding in from the right, listing a group event, two group invitations and a join request with Accept and Decline buttons, then comment and reaction alerts — Notifications drawer with group invites

Nocturne Network private chat window in the bottom right with omar, a short friendly conversation about Friday plans with sent and received message bubbles and a message box — Private chat

Create-group modal

Own profile

Followers list

Edit profile

Profile posts grid

Posts the user reacted to

Another user's public profile

Private profile with pending follow request

Nocturne Network notifications drawer for a private account showing a follow request from hassan with Accept and Decline buttons, followed by comment, reaction and accepted-request alerts — Follow request notification

Nocturne Network Weekend Hikers group page, a side panel with the member avatars and a live group chat thread, next to a group post about a lakeside hike with a green mountain image — Group page with chat and posts

Nocturne Network Weekend Hikers group events tab listing a lakeside loop hike and a sunset picnic, each with a date, description and yes, no and maybe attendance counts — Group events with attendance

Nocturne Network group member list popover with a search box and the group leader marked with a crown, over the blurred Weekend Hikers page — Group members

Nocturne Network feed at phone width, a single photo post card with a sunrise image and reaction and comment bar above the bottom navigation bar of group avatars — Feed on a phone

Profile on a phone

Nocturne Network group chat at phone width, the Weekend Hikers panel with members, chat and events tabs and a conversation between salma, hassan, layla and Mina — Group chat on a phone

Nocturne Network notifications drawer at phone width, group invitations with Accept and Decline buttons above comment and reaction alerts — Notifications on a phone

Next experiment

go-byte