DEV Community

Cover image for My Experience Creating a Portfolio Website
Zachary Niehoff
Zachary Niehoff

Posted on

My Experience Creating a Portfolio Website

Welcome

I finally got a rough version of my portfolio up and running. It wasn't easy but it was a very rewarding experience. I started with a tutorial I came across on LinkedIn Learning.

Setting the Foundation

The tutorial shows you how to turn a premade bootstrap page into a simple portfolio showcase. I think it was a great starting point. I do not excel at CSS so bootstrap helped immensely in getting things into place. I really like Django's integration with the HTML. Being able to use variables and create loops right in the HTML is a really handy tool.

Bootstrap

Bootstrap is probably my new favorite tool. CSS is a handy skill to have, but I don't enjoy it and definitely don't want to make a career out of doing it. I much prefer working back-end and this lets me develop a useable decent front-end in no time.

Django

Running a "for loop" right in the html to create job cards and populating the information dynamically depending on the number of jobs in the database was very satisfying. I also liked how I could create a base page with most of the layout and have each unique page be an extension of it.

Heroku

This was the most challenging part. I can't remember why I ultimately went with Heroku but I had no experience using any web hosts yet. It was a pleasant experience though. The documentation was good and I got some command line experience with git.

The Hard Parts

Setting an environment variable took me quite awhile, since you can't host the secret key or your database login details. I was looking for answers without specifying I was using Heroku to host it. Once I found out about Heroku's config variables and "os.environ" everything started working.

The next hurdle was learning how to use an API(Dev.To's API) for the first time. I'm still not sure I did it 100% correctly but it works and displays some blog info. I'm kind of proud of the way I went about it. What I did was take the response from an API, convert it to json(), create a dictionary with all of the values, then nest that dictionary and return it with the render function. It was the only way I knew to get Django to let me separate the data and display each item individually.

The last hurdle was my own inexperience. I thought I was having more problems with the secret key/config variables and spent hours trying to fix it. It turns out when I was trying to "python manage.py runserver" in the cmd prompt I forgot that I needed to put "heroku run python manage.py runserver". I was attempting to run it from my own PC instead of heroku!

Still To Do

I need to make it look nice. I think it looks okay and I don't think I need to do anything major, but if anyone has any suggests I'm all ears!

I also need to figure out how to get my database images to show up. I got it to work one in an earlier version of the website but now they don't show up. I have static placeholder images and images imported from the blog, but I can't add a picture to the database and view it. I read that I might need to pay for a CDN but I feel like there has to be a way around it for just a few small images.

I still need to get the root domain to work, currently it only works if you type "www". I also need to look into getting a SSL certificate.

Thanks for Reading!

Anyways, it's something I created and I'm proud of doing it without using a website builder. It's up and running here

Edit: SSL certificate is up and running and I setup a redirect so my root domain works.

Discussion (1)

Collapse
rydwhelchel profile image
Ryan Whelchel

Hey awesome job man! I went through a very, very similar struggle with env variables with Heroku