Audio Twitter

Twitter clone made with React, Apollo, MongoDB, Material-UI, Wavesurfer

This is fullstack clone of Twitter with audio instead text messages. It is made for educational purposes only and it is not affiliated with Twitter in any way.

Features

General functionalities
- Record voice, preview oscilloscope, redo recording, preview recording, cancel recording, preview recorded waveform
- Store audio files to server
- Play/pause/stop audio messages with waveform preview
- Autoplay existing messages, autoplay incoming messages
- Limit autoplay duration to 5, 10, 15 or 20 seconds
- Timeline feed of messages of the following users
- Notifications feed, non-seen notifications count
- Profile page with user's messages feed, following and followers lists
- Social network functionalities: follow/unfollow users, like/unlike messages, repost/unrepost messages
- Local state management with Apollo cache, without Redux
- Edit avatar, cover, name and bio
Authentication
- JWT auth on http and websocket links
- Sign up with email/password, sign in
- User/admin role
- Protected routes with HOCs
Design
- Material-UI responsive design
- Choose between 4 different green/orange light/dark themes
- Persist theme in local storage
- Tabs navigation
- Popover with user card
GraphQL
- Queries User: users, user, me, whoToFollow, friends
- Queries Message: messages, message
- Queries Notification: notifications, notSeenNotificationsCount
- Mutations User: signUp, signIn, updateUser, deleteUser, followUser, unfollowUser
- Mutations Message: createMessage, deleteMessage, likeMessage, unlikeMessage, repostMessage, unrepostMessage
- Subscriptions: messageCreated, notificationCreated, notSeenUpdated
- Relay cursor paginations: Messages, Notifications
- Loaders: File, User
- Client Queries: autoplay, theme
- Client Mutations: updateAutoplay, setTheme
Database
- Mongoose Models: User, Message, File, Notification
- Seed database with Faker