I've been needing to create a new portfolio site and I've also been wanting to learn some new technologies so I thought this was a great opportunity to kill two birds with one stone. In this post, I will describe how I created my new portfolio site with Django.
As with any project, I think it's best to do a sketch to map out what you want the project to accomplish and how you'd like for it to look. For me, I knew I wanted a home page with a photo and description of myself along with some projects I have worked on. I also wanted a contact me form and a page to show my blog posts.
There is a pretty simple command for you to run once you have installed Django on your system.
django-admin startproject mysite obviously you want to change
mysite to the name of your project for me that was
When you create a Django project you will have the project directory but within your project, you will likely have
Apps these are the different sections of your website, for example, my portfolio will have a blog app and a jobs app inside of the main Django project. Essentially apps are the different sections of your project. I added two apps to my project. To create a new app you can run this command and change the
blog to whatever the name of the app you are creating.
python manage.py startapp blog and
python manage.py startapp jobs
When you created these apps you will see two new folders in your project. A blog folder and a jobs folder. Within those folders, you will find a
models.py file. This is where we will create and define our models with the attributes we want them to have. This is what my job model looks like.
class Job(models.Model): image = models.ImageField(upload_to='images/') summary = models.CharField(max_length=1000) heroku_url = models.URLField(max_length=100, null=True) github_url = models.URLField(max_length=100, null=True)
class Blog(models.Model): title = models.CharField(max_length=255) pub_date = models.DateTimeField() content = models.TextField() image = models.ImageField(upload_to='images/')
Step five - Migrations & Settings
Now that we have made changes to our models we need to let python know of these changes by migrating them to the database. To accomplish this we will run a few commands but first, we need to update our
settings.py file in our
portfolio folder. This is another step that is required to let Django know we made changes to our app that we want to apply. So navigate to that file and add the following code into the
While we are in the settings file this might be a good time to set up a path for our media files, this can be accomplished with the following
MEDIA_ROOT = os.path.join(BASE_DIR, 'media') and set the URL
MEDIA_URL = '/media/' Now we are finally ready to migrate, do that by running the following commands
python3 manage.py migrate and
python3 manage.py makemigrations At this point you may notice an error that states we don't have Pillow installed. Pillow is required when using the
ImageField so you will need to follow the instructions to install pillow which you can do by running
pip3 install Pillow
Step six - Admin
Let's check out the admin interface but first, we need to create a superuser, this is basically a user that has full access to the admin portal for your project. To create a superuser go back to your terminal and run
python3 manage.py createsuperuser and follow the instructions to create the username, email address, and password. Now let's start our server
python3 manage.py runserver and navigate to
/admin page and login with the superuser info you just created. There's not a whole lot of info on this page yet because we haven't added our apps to the admin. Go back to your project and inside the blog and jobs folder add this code below to your
from .models import Job admin.site.register(Job)
from .models import Blog admin.site.register(Blog)
Now you are able to create a new blog and new jobs with the attributes you set in your models.
I plan to add to this series next week where we will cover setting up the home page, adding bootstrap to our project, and showing all jobs and blog. Until then, check out the Django Project website for additional resources: