'Test' Subdomain
May 22, 2020
I created a 'test' subdomain (test.benmadison.dev). Here's how:
- When I upgraded this server to Ubuntu 20.04 (from 18.04) I decided to use "Virtual Hosts" instead of the default /var/www/html for Apache. In doing so, it gave me the flexibility to have multiple domains (or subdomains) on one server. Definitely much better than creating a whole new Droplet every time I wanted to mess around. This article from DigitalOcean is what I ended up using.
- Once there were two "Virtual Hosts", I had to use Certbot to create a SSL certificate for the new subdomain. I had to do this because Google requires it for the '.dev' TLD. Luckily, this was really straight forward and, once again, DigitalOcean had a great article on how to do this. The article says it's for use with Ubuntu 14.04 but I had no trouble using the same instructions for 20.04.
- Prior to letting Certbot create the SSL Certificate, I had to point domains.google's DNS 'A' & 'AAAA' records to my server for the 'test' subdomain.
I had originally done this to try to test out this tutorial on how to create a blog with backend GUI but it ended up being not exactly what I was looking for.
Now that this subdomain is created, I intend to use it more frequently as a staging website to test things before I put them on my actual website. Hopefully it will make things more recoverable if I make mistakes and helps me to visualize my projects easier.
General Site Updates
May 17, 2020
I haven't updates the site at all since the last post. It's mostly because I basically went from being nocturnal to actually having a normal sleep schedule. Within the next couple of weeks, I plan on doing more with this site. Mainly, I'd like to finish my main project or at least add a little bit more to it.
There was an interesting development recently-ish, though. On 5/8/2020, I received an email from DigitalOcean stating that my droplet had been disconnected from the network due to its involvement in a DDOS attack. I'm not quite sure what code caused this to happen or if it even had anything to do with my site files specifically. Basically, I was forced to start a new Droplet and move this site over to that.
I have a couple of hunches as to what may have contributed to this happening although it's possible that it could be a combination of these:
- I left port 25 open in my firewall
- I copied code from a random website
- I disabled a security feature in my ssh login
Number 1- I enabled this port a couple weeks prior in an effort to get the server to send email before I learned that DigitalOcean blocks this by default. After enabling it, I never disabled it.
Number 2- In an attempt to get my "Login" form to connect to my database and actually perform a login sequence, I copied a few files from a random website without paying much attention to the code.
Number 3- I disabled the secure ssh key feature to make Adobe Dreamworks work. I think this is the most likely culprit as it was the most recent thing I had done to the system prior to this happening.
When I made the new Droplet, I made sure to get rid of all of these mistakes and decided to increase the security a bit more. Root is now disabled, passwords have all been changed to be unique instead of the same, and the firewall has been locked down to only the essentials. Hopefully doing all of these things will have done the trick and will prevent any of that from happening again. I don't want to have to rebuild a server from scratch again.
Just in case this does happen again, backups are being taken weekly and I have created two Snapshots of the server in its fresh state.
"Create Account/Login" Project Updates
May 7, 2020
Changes made today:
- Used a template from w3schools to create a modal create account/login form
- Changed a couple of the form inputs to only allow a certain number of characters
- Fixed an error message with phpMyAdmin
The w3schools template was something that I had used with the original form used to create an account. However, I decided it might be cool to implement that form as a modal element. This means that it's hidden until a user clicks a button and then it animates onto the screen. w3schools had a template for this as well. I ended up just having to make a few minor changes to make it look okay on my website. The form appearance changes slightly when screen drops below 1000px.
I changed the "zip code" and "phone number" inputs on the "Create Account" form to only allow 5 characters and 10 characters respectively.
Ever since I created the Database for this project, I've been receiving an error message every time I look at it on phpMyAdmin. The error read: "Warning in ./libraries/sql.lib.php#613 count()". To fix this, I found this article. Once that change was made, the error message completely disappeared.
"Create Account/Login" Project Updates
May 6, 2020
I was able to do three main things today:
- Send emails utilizing a template that I created on SendGrid
- Create a way to verify email addresses
- Generate a MD5 hash for passwords
Starting with the template, it took forever to find documentation on SendGrid's website that might actually help me. Finally I stumbled upon this article that lets you plug in your API and Template key as well as some variables to send to the template. It then generated PHP code that I was able to easily copy and paste into 'create_account.php'. That code referenced variables that were already being POSTed from 'index.html' so I didn't have to add any extra code.
Now that I had email set up, I needed a way to verify email addresses once the account was created. I did this by adding a column called 'isverified' to the mySQL database. When the account is created, the value is set to '0'. Then, an email is sent with a link that leads to a PHP file and is appended with the email address and a randomly generated identifier. This PHP file then checks the database for the email address and identifier. If it exists, 'isverified' changes to '1'. If it doesn't exist, nothing happens. I'd like to change it to say something if it doesn't exist but that is a project for a different day; I'm burnt out.
Later on, I decided it would be cool to encrypt passwords to using MD5. I've read (but not really in any depth) that MD5 isn't very secure but since this is just a project I'm doing for fun, I'm not really concerned with trying to figure out a better way. It was surprisingly easy to implement. Literally all you have to do is set something equal to "md5(InsertWhateverHere)".
I'm trying to decide what I want to do next. I would like to finally take all of this information and actually create a login page that uses the database. I also need to make the form and output page match my website... right now they're just generic with no styling. Unrelated to this project, I've been meaning to work on the "Quick Links" that are located on the "Home" page. I want to change the borders of the images to match what the "Projects" page looks like.
Site Updates
May 3, 2020
Finally Some Updates: WebApp Functionality
- WebApp compatibility for iOS devices
- Splash Screen
- App Icon
- Transparent Status Bar
- No Safari UI Buttons
There were some major struggles that made implementing this take way longer than it should have. Theoretically, I should have been able to do everything listed above by only using some "<link>" and "<meta>" tags. Unfortunately, for some reason, it didn't all work. The App Icon and Splashscreens would work correctly, and I could disable the status bar, but the Safari UI Buttons would always show up on any page other than "Home".
Apple's documentation on this is very outdated (from 2016) and it was a struggle to find what I needed to do to fix this. My solution came from Google of all places. Apparently Google got tired of Apple's lack of documentation and created their own solution to the problem. I ended up having to make a "manifest.webmanifest" file, referenced on every page, to make the WebApp function the way I wanted. Now it works and that's all that matters.
Email Support for "Create Account/Login" Project
May 2, 2020
In my efforts to further improve the "Create Account" form, I decided that the next step I should take is implementing email. I wanted to do this so that when the form is submitted, an email is generated and then sent to the email address given on the form. It could be just a welcome email or, maybe in the future, an email verification.
The best option for me ended up being SendGrid. I chose them because their free plan allows for 100 free emails a day. Since this is just a project, this works perfectly for me. The other big selling point was that their API could integrate into the PHP already on my site.
Integration of this API was definitely a learning curve. I think that they assume that if someone is using their service, they're an expert when it comes to coding. Unfortunately, that isn't the case for me, and I struggled to make it work with the lack of documentation. My saving grace came from following an article on Medium. This article walked me through, step-by-step, how to make it work. Now that it's implemented and functioning (albeit in a very limited fashion), my next goal is to link the API back to a template that I created on the SendGrid site that matches the HTML of my website.
Due to the lack of documentation I addressed above, I think doing this is going to take a while for me to figure out. I'll update this post once I've accomplished this.
Welcome To My Website!
Apr 29, 2020
This website is definitely nowhere near complete right now but I wanted to do something with all this free time I've had. My goals for this site are to make things easier for myself when I'm working on projects and maybe potentially to someday let people see it as a portfolio. (If this is you, hi!)
If you're at all interested in what I'm working on or have worked on in the past, check out the quick-links to the left or the 'Projects' tab above. Thanks for visiting!