Note
This project was completed as part of the course requirements for [MPCS](52553 Web Development)
After cloning the repo, run the following commands in your terminal:
cd /path/to/belay_root_dir/server
You should now be in the server directory. Run the following command to install the dependencies:
pip3 install -r requirements.txt
Now you should be able to run the server with the following command:
flask run
- Unauthenticated users can create a new account
- Unauthenticated users can sign in with their username and password
- Unauthenticated users who try to access a room cannot see any messages in that room, and are sent to the signup/login page instead
-
Authenticated users can log out, change their username, and change their password
-
Authenticated users can see a list of all channels. For each channel, they can see how many unread messages they have in that channel
-
Visiting a channel marks all messages in it as read, and all new messages posted to that channel while the user is in it are marked as read too
-
Check for new messages in the channel at least once every 500 ms. Stop checking if the user leaves the channel. (Hint: use SetInterval)
-
Check for new unread messages in other channels at least once every second. Use only one HTTP request to get counts for all channels
-
For each message with replies, display the number of replies to that message just below the message content
-
All messages in a room have a Reply button or icon that opens the replies pane
-
[] Parse image URLs that appear in messages and display the images at the end of the message. (Hint: you may use the web to help you find an appropriate regular expression)
-
Users can add an emoji reaction to any message or reply. You may choose a limited set of emoji reactions you support.
-
Hovering over a reaction displays all the users who had that reaction
-
Only serve one HTML request. Handle all other requests through the API
-
Push the channel name (for messages) or parent message id (for replies) to the history and navigation bar when the user navigates to a channel or thread Users can use the Back button to navigate to a previous channel or thread
-
Loading the unique URL of a channel or thread should open the app to that channel or thread
-
If an unauthenticated user follows a link to a channel or thread, show them the login or signup screens, but if they log in or sign up, send them to the original page they requested
-
Save the user's auth key in localStorage or in a cookie. Include your CNETID as part of your storage keys so your storage won't conflict with those of other students on the graders' machines. e.g.
window.localStorage.setItem('trevoraustin_belay_auth_key', 'abcdefg')
Wide Screen:
- Show the list of channels down the left-hand side of the screen, and the channel the user is looking at (or a placeholder for no channel) on the right-hand side
- Clicking on the name of a channel loads that channel's messages into the right-hand column
- The current channel is highlighted in the channel list, and the names of other channels change have a subtle visual change on hover
- When viewing a reply thread, display the thread as a third column, narrowing the column with messages to fit it
- Users can click an icon or button to dismiss the thread panel
Narrow Screens:
- On narrow screens, the page has a one-column layout with a menu bar. Users see the channel list, the messages in one channel, or the replies to one message at a time, and not the other two
- When viewing replies, users can see the parent message they are replying to. They can click a button or link to navigate to the channel containing the parent message
- When viewing messages in a channel on a narrow screen, users have a button or link they can click to navigate back to the channel list
-
Store channels, messages, and user account information in a SQLite3 database
-
Create the database and its tables with migrations Start the name(s) of your migration file(s) with ISO 8601 timestamps so that the file system will list them in the order they were created. Check those migrations into version control for your assignment, alongside the actual database file
-
Create a table for channels that stores a unique id and the channel name
-
Create a table for messages that stores, at a minimum, what channel the message is in, the id of the user that wrote the message, and its text contents
-
Store Replies in the Messages table. Implement a way of distinguishing regular messages in a channel from replies to a message (e.g. with a
replies_tocolumn that is null for normal messages but contains a messsage_id for Replies) -
Create a table for reactions that stores, at a minimum, the emoji, the id of the message or comment it is a reaction to, and the id of the user who made the reaction
-
Create a join table to capture the many-to-many relationship between Users and which Messages they have seen. (Hint: store the latest timestamp or message id seen for each user in each channel—you don't have to store every user-to-message pair)
-
Sanitize all database inputs by passing them as arguments to a parameterized query
- Give API endpoints a unique path namespace to distinguish them from your HTML
path(s) e.g.
/api/endpoint1,/api/encpoint2etc - Create an authentication endpoint that accepts a username and password, and returns a session token
- Authenticate to other endpoints via session token in the request header (not as a URL param or in a request body)
- Use GET requests for API calls that don't change data on the server, and POST requests for API calls that do change data on the server
- Create endpoints to create and get channels and messages, and to update a user's last read message in a channel
- Create an endpoint to return unread message counts for the user for each channel in a single request with a single database query