cs50 Mail Project

I am really excited to have the CS50Web Mail project finished. This video is a part of the CS50 web programming project which demonstrates it in action. It used Python & Django as back-end technologies and HTML, CSS, Bootstrap, and JavaScript are used in the front-end.

The project has five specifications which are demonstrated in the following time stamps.



0:00 Send mail: When the send button is clicked the email is actually sent and the sent mailbox is loaded showing up all sent emails including the most recent one.



0:50 Mailbox: When the user clicks on the Inbox, Sent, or Archive buttons the appropriate emails are loaded in their specific mailboxes. Besides the background color also differs according to the read status of the email considering that when I click on an email and view its content, it is marked as read.


1:44 view Email: When the user clicks on listed emails on any of the mailboxes, it shows up the emails' contents, in particular the sender, recipients, date, subject, and body of the email.



2:25: Archive and Unarchive: these buttons allow users to archive and unarchive emails that they have received. These buttons are only in inbox and archived emails. If the user either archives or unarchives an email, the user's inbox is loaded.


3:04 Reply: There is an additional reply button that gives the user the ability to reply to an email. This button takes the user to the compose mail form and prefills some boxes. The user can click on the send button and the reply is sent.



cs50
cs50 web
cs50 web project
cs50 mail
wiki

single-page application
single-page web application

Django
Django framework
python
HTML

CSS
javascript
js

web project
project mail
building a mail web app