Chat app using React-Native
Budget: $30 – $250 USD
A chatting app built with React Native, Socket.io and React Navigation. No backend, just frontend. As simple as possible.
iOS versions: 12+
Android versions: 7.0+
SCREEN
- main screen (messages)
- search screen (for messages)
- contacts list screen
- chat screen
- archived messages screen
- settings screen
- login screen
- forgot password screen
DESCRIPTION
The user must login by establishing a session with a REST API, accessing a message screen similar to WhatsApp. The session will maintain communication via websocket. The websocket server and REST API server must be simulated (no backend necessary)
Websocket:
- Send and receive messages
- Send and receive read and receive confirms
- Server notifications
- Contacts profile updates
- Block/unblock contact
REST API:
- Establish the login session
- Send a password recovery request
- Update user profile information
- Send contacts list to the server
The conversation must support displaying and sending text, image, audio, and location messages. It should be possible to record the audio to send, just like in WhatsApp. It should be possible to take a photo or send an image file, just like on WhatsApp. It should be possible to send the current GPS coordinates as a message.
In the conversation, it should be possible to see the contact information (profile), similar to WhatsApp. Profile must have "save contact" button to add profile information to device contacts. The profile must have the option to "block/unblock" the contact. The profile should present the option of "notifications" with the options "default", "always notify" and "never notify" (mirrored in the settings). The profile must have the option "archive the conversation", which can be automatically unarchived when receiving a new message, as per the option selected in the settings (similar to WhatsApp).
The main screen should have a search option for words present in messages, similar to WhatsApp. The main screen must be able to have messages pinned. On the main screen, when holding the message, icons should appear, similar to WhatsApp, with options to “archive message”, “pin message” and “delete message” (with prior confirmation).
The contacts screen should list all contacts that have already received a message. It should also list device contacts if the contact was manually loaded through settings. When touching the contact, the message screen should open. When holding the contact, you must access the user's information (profile, similar to conversation).
The settings screen should be divided into:
- "Profile": It should be possible to change name and description (similar to WhatsApp), sending the update via REST API;
- "Contacts": It must be possible to "load contacts from device contact list", which must load contacts and associate with already existing contacts that use the same phone number and send this to the server (REST API). And it should be possible to "remove contacts without message history", which should display a message confirming the action and, if confirmed, delete all contacts without message history (send this action via REST API). Holding the contact, it should be possible to remove the contact, asking for confirmation if there is message history (send this action via REST API).
- "Notifications": Must be an option to enable/disable all message notifications. There should be an "always notify" contact list and a "never notify" contact list. There should be a list of "Blocked Contacts".
- "Conversations": It should be an option similar to the "archived messages" function of WhatsApp, and an option to "Clear messages older than X days" which, when triggered, displays a message confirming the action and, if confirmed, deletes all messages older than X days.
iOS versions: 12+
Android versions: 7.0+
SCREEN
- main screen (messages)
- search screen (for messages)
- contacts list screen
- chat screen
- archived messages screen
- settings screen
- login screen
- forgot password screen
DESCRIPTION
The user must login by establishing a session with a REST API, accessing a message screen similar to WhatsApp. The session will maintain communication via websocket. The websocket server and REST API server must be simulated (no backend necessary)
Websocket:
- Send and receive messages
- Send and receive read and receive confirms
- Server notifications
- Contacts profile updates
- Block/unblock contact
REST API:
- Establish the login session
- Send a password recovery request
- Update user profile information
- Send contacts list to the server
The conversation must support displaying and sending text, image, audio, and location messages. It should be possible to record the audio to send, just like in WhatsApp. It should be possible to take a photo or send an image file, just like on WhatsApp. It should be possible to send the current GPS coordinates as a message.
In the conversation, it should be possible to see the contact information (profile), similar to WhatsApp. Profile must have "save contact" button to add profile information to device contacts. The profile must have the option to "block/unblock" the contact. The profile should present the option of "notifications" with the options "default", "always notify" and "never notify" (mirrored in the settings). The profile must have the option "archive the conversation", which can be automatically unarchived when receiving a new message, as per the option selected in the settings (similar to WhatsApp).
The main screen should have a search option for words present in messages, similar to WhatsApp. The main screen must be able to have messages pinned. On the main screen, when holding the message, icons should appear, similar to WhatsApp, with options to “archive message”, “pin message” and “delete message” (with prior confirmation).
The contacts screen should list all contacts that have already received a message. It should also list device contacts if the contact was manually loaded through settings. When touching the contact, the message screen should open. When holding the contact, you must access the user's information (profile, similar to conversation).
The settings screen should be divided into:
- "Profile": It should be possible to change name and description (similar to WhatsApp), sending the update via REST API;
- "Contacts": It must be possible to "load contacts from device contact list", which must load contacts and associate with already existing contacts that use the same phone number and send this to the server (REST API). And it should be possible to "remove contacts without message history", which should display a message confirming the action and, if confirmed, delete all contacts without message history (send this action via REST API). Holding the contact, it should be possible to remove the contact, asking for confirmation if there is message history (send this action via REST API).
- "Notifications": Must be an option to enable/disable all message notifications. There should be an "always notify" contact list and a "never notify" contact list. There should be a list of "Blocked Contacts".
- "Conversations": It should be an option similar to the "archived messages" function of WhatsApp, and an option to "Clear messages older than X days" which, when triggered, displays a message confirming the action and, if confirmed, deletes all messages older than X days.