Goal

Figure out why DIMMiN returns a 400 Error when being accessed via dimmin.com.

Pomodoro

25 minutes work 5 minutes rest

Notes

I contacted Namecheap customer support yesterday and asked them about why there was an issue. They couldn't resolve the problem and pointed me towards Heroku's tech support so I'm going to try and reach out to them this morning.

I decided to read through the Custom Domain Documentation before trying to contact them. First thing I needed to do was update the Heroku CLI using the

heroku update

command in Powershell.

Custom Domain with Subdomain

A custom domain with subdomain should allow me to access the DIMMiN App when I enter www.dimmin.com in the URL. The docs suggested running the following commands:

heroku domains:add www.dimmin.com -a dimmin

The output of which was the DNS Target for Namecheap's CNAME records of

terrestrial-dilophosaurus-nxgpzhtuzdo2djtifg21maag.herokudns.com

Which I configured on Namecheap's Advanced DNS page in the following way:

Custom Root Domain

A custom root domain should allow me to access the DIMMiN App when I enter dimmin.com in the URL. The docs suggested running the following commands:

heroku domains:add dimmin.com -a dimmin

The output of which was the DNS Target for Namecheap's ALIAS (or ANAME) record of

sleepy-tiger-d55y34akn60z6do8ht7px6fl.herokudns.com

Which I configured on Namecheap's Advanced DNS page in the following way:

Browser Errors

For whatever reason, after installing chrome on my desktop both www.dimmin.com and dimmin.com are accessible. When I use duckduckgo and chrome on my phone I'm returned the dreaded 400 Error. After clearing my cache on these browsers, I was able to access my site without issue, however I was only able to access it after accessing www.dimmin.com first.

It looks like I can access dimmin.com from the custom domains, but I'm still running into the 400 errors when using mobile. I'll add this as a Pending issue and return to it if it causes me too much trouble.

Local App Installation

Now I'm back where I was on 2023-06-01, setting up a local version of my web app I need to now re-route from http:// to https:// in my Django app. I decided to start fresh with a Virtual Environment and use Anaconda to help manage my packages for installing the app. Now I can launch VS code through the Anaconda navigator and more easily access my virtual environment. It's already activated on startup using the command

conda activate dimmin

Then I tried running the pip installer for the requirements.txt file again

pip install -r requirements.txt

which this time had no problems installing psycopg2! I tried running a local version of the app using

python manage.py runserver

and ran into an error where I hadn't set my environment variables for SECRET_KEY, AWS_ACCESS_KEY_ID, AWS_SECRET_ACCESS_KEY, DATABASE_URL, and SENDGRID_API_KEY. I ended up logging into my old computer and copying, pasting, and sending all of these keys and saving them into a .env file.

Now the site can boot up when I run

python manage.py runserver

but I ran into the following error:

settings.DATABASES is improperly configured. Please supply the NAME or OPTIONS['service'] value.

To fix this error I added some code that set the DATABASE variable to use SQLlite when Debugging and PostgreSQL in Production. Now a Local Version of the DIMMiN App is up and running!

Another thing I noticed was that the Copyright for the site was out of date. I was able to fix this by replacing 2022 in base.html with

{% now "Y" %}

So that the HTML for that line now reads

<p>{% now "Y" %} © DIMMiN.</p>

Fancy fancy.

Now that I had made a few changes it was time to push those changes to GitHub, then re-deploy those changes to the app on Heroku.

Pushing to Production

Github

• git status
  • Checking which files were staged and which were not
• git add .
  • Adding all my changes to staging
• git commit -m "installed new local version, dynamically updated copyright"
  • Commiting my changes to the branch
• git push
  • pushing all of these new changes to DIMMiN's github repo.

Heroku

I added a Staging environment app called dimmin-staging. I added the environment variables (called Config Vars by Heroku) from the original DIMMiN App (what I'll consider Production) to the Staging environment using the app settings.

• git checkout -b staging
  • created a new branch for the staging environment
• git push -u origin staging
  • Added all the current changes to this new branch
• git checkout master
  • Switched back to the master branch

• git push origin master

  • Made sure the master branch was up to date

• heroku git:remote -a your-app-name

  • Selected my DIMMiN app in Heroku
• git remote -v
  • Confirmed that the heroku version and github version were the same
• git push heroku master
  • Pushed those new changes to the Heroku app. I should also add a Staging environment.

Then these changes were finally pushed to production! I added the following line to settings.py

SECURE_SSL_REDIRECT = True

to force http requests to be redirected as https requests.

I tried using Max's phone to access dimmin.com but I still got the 400 error and I don't know why. With the help of this post I know I can now run a local version of the app using:

python manage.py runserver 8081

Results

• Updated the Heroku CLI
• The site is now accessible using the subdomain www.dimmin.com
  • This still re-routes to a version of the app without the SSL certificate, but that will be a change that I need to make in the actual DIMMiN App itself.
  • For whatever reason this is not a problem on chrome browsers, but edge keeps giving me issues. Not sure exactly why but edge was just being a pain in the butt.
  • Occasionally can access the site using dimmin.com, but that might just be an issue with my personal devices
    • Specifically having trouble accessing it on mobile from my own device
• Began using Anaconda to manage Virtual Environments
• Transferred credentials for Environment Variables
• Got a Local Version of the DIMMiN App up and running on my new laptop
• Updated the Copyright at the bottom of the screen (found in base.html) so that it always displays the current year
• Added a Staging environment and app (though it's not really used)
• Updated the DIMMiN App in Production
• Updated the app so that http requests redirect to https

Next Time

• Finish up Beauty is in the Eye of the Beholder so you can move on to A Fort Minor Solution.