ShortView

I FINALLY managed to deploy the project!
So I did a few changes on some settings and config files, and then started deploying the website.
At first, I used Nest (The server provided by HackClub to host projects), but it broke my project because it uses a proxy, which masks the IP address from the request and causes some issues with parts of the app, so I had to host it myself.
So I made a small setup in my room with my raspberry pi, and configured it as a web server, opened the necessary ports on my router, and after a few very long days, I finally managed to properly deploy the website using an Nginx server with SSL security.
I just finished writing a little readme, and made a full deployment guide. I'm now currently making a little banner for the project, and then I'll be ready to ship a minimum viable product (I may have some beef with CSS but meh, who cares about styling anyway), YIPEEE!

First, I spent quite some time reworking on the project's code in order to reorganize everything, create some helper functions to avoid repetitions, and stuff like that. This part is not directly visible by the user, but the code is now way easier to understand and to expend.

I also added dark mode, with a bit of styling for the page to be displayed according to the browser's color mode, which is great because that bright white page was starting to blind me a bit 😅

And the thing that took me the longest was to update the entire project for it to be translatable in other languages.
I went into each file to mark each and every string of displayed text as translatable with the gettext module from Django, this includes the python files, html files and js ones as well. And after spending way too long to figure out how all of this works, I generated the translation files, and manually wrote all the translations for the French language.
Now, if the browser is set to display pages in French, then the website will be displayed in French, else it will default to English.

I mainly improved some things here and there, including the registration form, with some basic conditions to accept, I also fixed a few bugs with registration and preferences, I also improved the format for the emails, and the last thing is not visible in the interface but I added scheduling for some functions to periodically execute in the code, for stuff like deleting expired pixels for instance.

I improved a bit the way each link is listed on the home page, by adding the domain of their destination url as well as the number of times it has been clicked.
I also added a button to delete a link, with a confirmation popup, and added a bit of styling around the shortened link to make it more visible.
But most of all, I configured my subdomain to also turn it into a mail domain (using Zoho mail), and configured Zoho mail and Django to be able to send automated emails from the web platform in order to notify the user when his link has been clicked. The user can also set an account-wide preference or a link specific preference to choose whether to send an email on the first click, on each click, or to never send one. I will now continue by adding better styling and format the emails sent.

The interface is now fully fixed and adapted to create short links.
I also coded the tracking system, which now successfully logs each click on the short link, except if the person clicking it created it (if he's connected to the account owning this link).
For the person clicking the link, he will get instantly redirected to the destination url.

I finally managed to migrate everything and rename the whole django project after recreating it from scratch and copying relevant files and code blocks, and renaming every variable in the code to be relevant to the new app.
This project has now become ShortView! Monitor the shortened links you send!

I added the link to the webapp to directly get an image, which can be tracked since it does a request to the server.
HOWEVER, I need to change basically the whole system because I realized that when putting an image from a url in a google email, it automatically copies the resource to google's servers, which mean that the request to my server is never made, therefore not allowing to track when someone opens an email.
Since I already did quite some work on this project, I'll just change it a bit to something else.
So, now introducing ShortView! (I guess)
Instead of using an invisible pixel, you'll be able to create a shortened link to a webpage, and the webapp will register clicks on the link, so that you'll know if the person you sent the link to clicked it or not, with all the usual information.
As an attachment, I put a screenshot of the image displaying properly when requesting it from the url, but now I'm going to replace this with the webpage the shortened link points to.
So, time for some model changing, variable renaming and database struggle now 😭

I added a page to create a new pixel agent, on which the user can give its properties. The pixel will then be created and saved in the database, and the user will be redirected on the newly created pixel's page. The pixel will also be displayed in the home page.
I also properly set up the django site model, meaning that it can now create absolute urls.
So I changed the way that pixel's url works: before, each pixel would have its url saved in the database, but now it's not statically saved anymore, but created on the go using the pixel's id and the domain when needed. So now, on a pixel page, it is possible to copy properly its display url (which were placeholders before).

I added a registering system to create a new account.
It verifies that both the username and email address aren't already in use on the platform, and it checks for basic password requirements.
There's also hint texts when hovering above the fields which explains the requirements for the username and the password.
This is done with client side javascript first, then checked again with server side python.
Then, if everything is conform, it will create a new user account in the database, and attach a profile model with the default user preferences.
From there, the user will automatically get logged in, and will be able to log in later, and use his account normally.
I also fixed some bugs here and there.

I added a page which will display information about the selected pixel, displaying its image url which can be copied, as well as a history of each time the mail containing it has been opened, with the date, ip address and request header from the opener (for now this is manually entered placeholder data, but the display part is working).
I also added a page to modify user preferences, for now the only ones are whether or not to display expired pixels, and the default expiration time, with the ability to set it to never expire (in the future, when the pixel functionality will actually be implemented, an expired pixel won't register mail openings anymore, which is useful to avoid notifications from old pixels later on).

I started adding some CSS styling, to use different colors depending on whether the mail containing the pixel was opened or not, and to cross out expired pixels.
I also spend waaay too long figuring out how to reload the static css file after an edit before realizing the browser kept the old one in cache 😭.

Continuing the project that I started building before Summer of Making, but for now I'm on the early stages of it, so the largest part is still to be coded.