Make a simple Django Portfolio Project as Data Scientist — Part 3(Final)

In this third part, I will make the full part dynamic with Django model and admin, after adding this functionality I will deploy it on my hosting server which is a shared hosting service Cpanel, I will also deploy the full project to Heroku to show how it can deploy this project with git repository.

For the portfolio and blog section, I have just redirected the contents to the Medium blog site, because it saved me lots of time.

My website is live on: https://www.tusher16.com

The full project is on: https://github.com/tusher16/My-portfolio-project

The first part of this project:

Make a simple Django 3.2 Portfolio Project as Data Scientist — Part 1

Second Part of this project:

Make a simple Django 3.2 Portfolio Project as Data Scientist — Part 2

Table of Contents

1. Database Models
2. Adding Models To Our Django Admin Site
3. Add all the pages using the same process.
4. How to Paginate Django Query Results
5. Deploy in Heroku using Github Repository
6. Deploy in Cpanel shared hosting

After Deploying my full site will look like this.

My website Live

In this section, I will make some models in models.py , then in views.py I will call that model and render it into our .html file. After adding into views I will update the admin.py with the model class that I have added in the models.py. Then if we go to Django admin there will be a field section in which we have created in the models. we will see more in the process.

Database Models

Model is the most important part of Django. A model is a Python class that subclasses django.db.models.Model, in which each attribute represents a database field. we will define the data models for our side profile In models.py we will make database classes in python, after that we will run the migration commands Django backend will automatically turn these python classes to SQL to store data in our database.

Now lets Model add our models for side profile navigation.

My side panel navbar model

In the model, I have added the My_profile_nav class where I have created a few fields which is name, short_intro, side_profile_pic, and links, after running migration Django will atomically make this My_profile_nav into a database table name and short_intro, side_profile_pic, links will be column head that will store our data.

PHPMyAdmin Mysql panel

After running the migration this table and fields will be created.

let's update the views.py to use the My_profile_nav model and create to object to pass that into our .html file.

This is a simple function-based view

Adding Models To Our Django Admin Site

We will create an admin panel to create and manage Posts. Fortunately, Django comes with an inbuilt admin interface for such tasks.

Now we will update admin.py for the side profile and register the Post model, to use this on Django admin(127.0.0.1:8000/admin )

admin.py

Now let's install the pillow first because we are storing image files into Django media. for rendering images, we must install pillow first.

Install pillow:

pip install pillow

Database migrate:

Now that our new database model is created we need to create a new migration record for it and migrate the change into our database.

python3 manage.py makemigrations

python3 manage.py migrate

After migration let's go to http://127.0.0.1:8000/admin which is Django site admin. In there we have to log in with our superuser and password which we have created during the first part of this blog.

You should see a login page, enter the details you provided for the superuser.

admin login page

let’s add data into my My_profile_nav fields:

After adding data:

After adding data we can see there is our first data showing in the list

we can edit the fields on the admin panel

Now we have to add Django template data to our HTML file:

Django has its own templating engine so now we have to add for loop to fetch all the data from our database, In this case, it will fetch only one data called name, because we have only one data in the name field.

For Image tag:

For adding an image we have to use an extra URL because Django will load the image from media files using URL.

{{ My_profile_nav.side_profile_pic.url }}

In urls.py main URL

Updated all the views with Navbar:

Now let's do the same for rendering other pages, and also added the required tags in the HTML files to render the data from our database. now if we run the server we will get the same navbar to all the web pages.

Home Page:

For better understanding, I have created a process through a chart.

1st Step -> Model added for Home Page with Full name, My_job_status etc.

2nd Step-> Views for call from model

3rd Step-> Update Register admin for My_profile_home

4th Step -> Migrate Database to create all the model into database

5th Step -> Add Data into admin interface

6th Step -> Add the object into html for render data from database

Resume Page:

For the resume page, I have added my google doc to my resume page just using the google doc embed feature and added the embed link into the container.

Add Paginate in the Blog, Portfolio, and Research paper section:

“Pagination is the process of splitting the contents of a website, or a section of contents from a website, into discrete pages.”

For example, if I got 20–30 blog stories, paginate will show the blog page into 6 items in a single page then the next items will be going to different pages.

The example is for just my blog page:

I have added into my views.py file in the blog function.

now let's add the paginator page counter in the blog-home.html page.

like this, I have added this paginator feature in Portfolio, and Research paper section also.

I followed the process from this youtube link: How to Paginate Django Query Results

Portfolio, Testimonial, Research paper, Blog page added:

1st Step -> Lets add Models into models.py

Portfolio models section

Blog models section

Research models section

testimonial models section

2nd Step-> Views for call from model

3rd Step-> Updated admin for side profile

4th Step -> Migrate Database to create all the model into database

python3 manage.py makemigrations
python3 manage.py migrate

5th Step -> Add Data into admin interface

Now go to http://127.0.0.1:8000/admin/ section and login with superuser and password. Fill in all the data as required fields.

My Blog Section in Django admin

My Portfolio Section in django admin

My Research Section in django admin

My testimonial Section in Django admin

6th Step -> Add the object into html for render data from database

Blog-home.html

In Line 38 I have added a for loop to show all the My_blog objects in the media row. {% for My_blog in My_blog_object %}

Inside the for loop I have added my model contents for example for the image I have called this: {{ My_blog.blog_image.url }}

For blog title i have called: {{ My_blog.blog_title }}

like this, I have added all the objects that I need. Then I closed the for loop by adding {% endfor %}

let's do the same for the portfolio and research paper page.

After adding the portfolio, Research paper, blog section in the separate models and pages now let's add Featured projects/blog/research projects on the page home page.

In Line 7,8,9 I have added (Featured=1)[:3] for showing the featured object(blog/protfolio/reserach) from the database . This will also show 3 items from the list.

As i was using Mysql server for development process, I got an error for string value,the error was: (1366, “Incorrect string value: ‘\\xE2\\x80\\x8A\\xE2\\x80\\x94…’ for column django

I solved the issue by changing the character set encoding to UTF-8 for the database itself in MySQL.

Deploy:

For this, I am using the default SQLite that comes with Django as my Relational DataBase Management System. You can use Mysql or any other RDBMS you prefer.

Deployed in Heroku: tusher16.herokuapp.com (it may be down sometime as it is a free service)

Deploy Your Django Application On Heroku Using GitHub

Deployed in Cpanel: tusher16.com

This is how I have uploaded the full files and deployed them through the Cpanel.

How to Deploy any Django Project in Cpanel

After deploying to Cpanel I have added SSL certificate and HTTP to HTTPS:

How to redirect HTTP to HTTPS Using .htaccess

How to Install an SSL/TLS Certificate In cPanel 11.x - The SSL Store™

Reference:

How to install and configure Django on Linux shared hosting

Share links to PDF versions of your files

Building A Blog Application With Django | Django Central