From bf36bb8cdc00affad3201587c987e5858eafdeff Mon Sep 17 00:00:00 2001 From: Ayoub Abidi <68862589+ayoub3bidi@users.noreply.github.com> Date: Tue, 4 Oct 2022 17:11:14 +0100 Subject: [PATCH 1/2] Create Chatroom.md --- Projects/2-Intermediate/Chatroom.md | 27 +++++++++++++++++++++++++++ 1 file changed, 27 insertions(+) create mode 100644 Projects/2-Intermediate/Chatroom.md diff --git a/Projects/2-Intermediate/Chatroom.md b/Projects/2-Intermediate/Chatroom.md new file mode 100644 index 00000000..2c65c104 --- /dev/null +++ b/Projects/2-Intermediate/Chatroom.md @@ -0,0 +1,27 @@ +# Chatroom App + +**Tier:** 2-Intermediate + +Real-time chat interface where users can interact with each other by sending messages using a serverless platform (e.g. Firebase). + +## User Stories + +- [ ] User need to register (username, email, password and an avatar image), then he can login (email and password). +- [ ] User can see an `input field` where he can type a new message. +- [ ] User can see a `sidebar` where he can see a `navbar` which have his name & avatar image and a `logout button`, a `search bar` to search for an account, and his `previous contacts` and their latest message. +- [ ] By pressing the `enter` key or by clicking on the `send` button the text will be displayed in the `chat box` alongside his username and avatar image (e.g. `John Doe: Hello World!`) + +## Bonus features + +- [ ] User can login with Facebook, Twitter or GitHub. +- [ ] User can send images, videos and links which will be displayed properly. +- [ ] User can select and send an emoji. + +## Useful links and resources + +- [Firebase docs](https://firebase.google.com/docs?authuser=0&hl=en) +- [How to Build a Chat App with Firebase](https://www.cometchat.com/tutorials/how-to-build-a-chat-app-with-firebase) + +## Example projects + +- [sector-r](https://sector-r.vercel.app) From 1c6199d0d850355968138aafe1206b060da4c7b9 Mon Sep 17 00:00:00 2001 From: Ayoub Abidi <68862589+ayoub3bidi@users.noreply.github.com> Date: Tue, 4 Oct 2022 17:26:56 +0100 Subject: [PATCH 2/2] Add Chatroom to the table --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index f6557617..8b10fa31 100644 --- a/README.md +++ b/README.md @@ -88,6 +88,7 @@ required to complete them. | [Calculator CLI](./Projects/2-Intermediate/Calculator-CLI.md) | Create a basic calculator cli. | 2-Intermediate | | [Card Memory Game](./Projects/2-Intermediate/Card-Memory-Game.md) | Memorize and match hidden images | 2-Intermediate | | [Charity Finder App](./Projects/2-Intermediate/Charity-Finder-App.md) | Find a Global Charity to donate to | 2-Intermediate | +| [Chatroom App](./Projects/2-Intermediate/Chatroom.md) | Real-time chat app using serverless platform. | 2-Intermediate | | [Chrome Theme Extension](./Projects/2-Intermediate/Chrome-Theme-Extension.md) | Build your own chrome theme extention. | 2-Intermediate | | [Currency Converter](./Projects/2-Intermediate/Currency-Converter.md) | Convert one currency to another. | 2-Intermediate | | [Drawing App](./Projects/2-Intermediate/Drawing-App.md) | Create digital artwork on the web | 2-Intermediate |