Week 7: Messaging And A Home Page!

Hey guys! So last week, we finished completely restructuring the database and today I’ll explain how I created a temporary messaging system using email and created a home page. 

If you guys remember, one of the new fields I created with the user profile was the email:

Email = Forms.EmailField(Max_length=100)

One of the benefits of attaching the email to the user object is that I can not only view the email but link it to specific buttons. This way, I can allow members to email each other. Using this html code, I created a button that sends a request for an item. It redirects the user to an email page, where they can send the donor any details about the transaction:

<H3><A Href=”Mailto: {{Object.User.Email}}” Class=”Btn Btn Primary” >Send Request For Item<A></H3>

The next thing was to create a basic home page. Currently, when users search up the website, they are immediately directed to the login page. However, on most websites, new viewers are redirected to a home page, which describes their website and its mission. To create and connect a new page, there are three steps: 

1. Create the html template
2. Create the url connection
3. Create the views 

Creating the HTML template was quite simple. I first created a FIGMA model, which creates a visual representation of the home page. Then I started working with the CSS and started actually designing the website. Although this was initially very tedious, I slowly learned how to do more CSS and tricks to optimize the process. Below is the Figma model I created:  

The next step was creating the urls, which helps connect the web pages together: path(‘ ‘, views.home_page, name=’home’), 

Finally, I created the views, which allowed the homepage to actually render: 

In the next post, I’ll completely wrap up the backend (adding more to the homepage and starting more frontend work). Catch you guys next week!