Global Doctors is a blog about medical doctors who love to travel and work as locums all around the world with a job board for interested locum doctors. Global Doctors has been developed as part of the Code Institute's Full-Stack Developer course as my 4th project - focusing on Django and Bootstrap frameworks, Database manipulation, and CRUD functionality.
View the live site here : Global Doctors
For Admin access with relevant login information: Global Doctors Admin
README Table of Content
Global Doctors is a blog about medical doctors who love to travel and work as locums. Users are invited to:
Global Doctors is accessible via all browsers with full responsiveness on different screen sizes. It aims to create a safe, informed community of doctors who can interact,share, and learn from one another. I have created this site to meet the needs of the growing community of global doctors. In a world that is rapidly progressing globally, there are more and more opportunities for doctors to explore the world and exercise their profession. Global Doctors aims to offer a starting point for creating a community of regular users and employers to facilitate communication and job opportunities. In future developments of this project, I hope to offer the admin and users the chance to communicate via email. Other features will include events, a newsletter and a funding section.
The project goal was to build an interactive blog with a job board to connect interested users. I aimed to create an easy, uncomplicated job posting system for employers and a job application process for interested doctors. Through planning and design prep work, I realized that there was an opportunity to treat this service like a 'brand' and develop the idea further. A social element was born from this with an idea for users, both employers and doctors to be able to share advice and images of their experiences on the website. This would hopefully help to create an informative and motivational group of users who would recommend the site to others, share articles outside of the core group, and attract more users to sign up. Following common social-media design trends, I planned to use high-quality, photographic images, and an attractive, connected colour scheme.
Global Doctors is my first project following Agile planning methods. I used my Github Projects Board to plan and document all of my work.
I chose to follow the MoSCoW Prioritization method for Global Doctors, identifying and labeling my:
Must Haves: the 'required', critical components of the project. Completing my 'Must Haves' helped me to reach the MVP (Minimum Viable Product) for this project early, allowing me to develop the project further than originally planned.
Should Haves: the components that are valuable to the project but not absolutely 'vital' at the MVP stage. The 'Must Haves' must receive priority over the 'Should Haves'.
Could Haves: these are the features that are a 'bonus' to the project, it would be nice to have them in this phase, but only if the most important issues have been completed first and time allows.
Won't Haves: the features or components that either no longer fit the project's brief or are of very low priority for this release.
User stories and features recorded and managed on GitHub Projects
User Story | Priority |
---|---|
As a site user I can view a paginated list of posts so that I can choose which post I want to view | MUST HAVE |
As a site user/site admin I can view comments on an individual post so that I can read the conversation | MUST HAVE |
As a site user I can view a maximum of 6 posts in each category so that I have a good overview and can browse through the pages | MUST HAVE |
As a site user/visitor I can view the jobs details so that I know when the job starts, ends and when it was created. | MUST HAVE |
User Story | Priority |
---|---|
As a Site User I can register an account so that I can comment on a post | MUST HAVE |
As a User I want to be able to log in and create a profile so that I can choose which user I am and what CRUD I want to do. | MUST HAVE |
As a User I can register my account and create my profile so that I can comment and like posts and submit a post to be published | MUST HAVE |
As a Regular User I can create a profile so that I can see all the jobs I have applied to and posts that I have submitted that have been published and those awaiting approval | MUST HAVE |
As a User I can specify on the signup what kind of user I am so that I have certain accessibility and function on the site | MUST HAVE |
As an Employer, I can create a profile so that I can see all the jobs I have published | MUST HAVE |
As a user I can register with my email address so that I can receive email replies from the website | WONT HAVE |
User Story | Priority |
---|---|
As a user I can view the different categories of the blog post so that I get an overview of the different posts. | MUST HAVE |
As a User I can open a post so that I can read the content of the whole post on another page | MUST HAVE |
As a site admin I can create, read, update, and delete posts so that I can manage my blog content | MUST HAVE |
As a logged-in user I can create draft posts so that I can finish writing the content later | MUST HAVE |
As a site user I can write comments on individual posts so that I can be part of the conversation | MUST HAVE |
As a logged-in user I can like a post so that I can participate in showing my appreciation for the content of the post to others. | SHOULD HAVE |
As a site user I can view the likes on a post so that I can be informed about the amount of likes on a post. | SHOULD HAVE |
As a site user I can modify or delete my comment on a post so that I can be involved in the conversation. | MUST HAVE |
As a regular user I can add a post so that I can share my story or experience | MUST HAVE |
As a logged-in site user I can use the post form so that I can submit a blog post for review and publication by the admin | MUST HAVE |
As a logged-in user I can write a post in a nice form so that I can contribute to the blog | MUST HAVE |
As a site user (both regular and employer) I can modify or delete my posts so that I can make changes if I want to. | MUST HAVE |
User Story | Priority |
---|---|
As a user, I can view all the jobs so that I can apply for a job if I qualify | MUST HAVE |
As an Admin I can approve the job posts so that the jobs can be published on the site to seek applicants | MUST HAVE |
As a site user I want to navigate to the About page to find out more information about the site. | MUST HAVE |
As a site user I can view 6 jobs in each speciality per page so that I have a good overview of the jobs | COULD HAVE |
As a regular user I can add a star rating to the jobs so that I can express my liking of the job. | SHOULD HAVE |
As a regular or employer user I can delete my job applications or job posts so that I have full control over my respective posts. | MUST HAVE |
As an employer, I can submit a job so that it is posted on the website | MUST HAVE |
User Story | Priority |
---|---|
As a Regular User I can apply for a job so that I can eventually get the job | MUST HAVE |
As a user I can use the application form so that I can apply for jobs | MUST HAVE |
As a Regular user I can modify or delete my job applications so that I can make changes if I need to. | MUST HAVE |
User Story | Priority |
---|---|
As a Site User I can click on the About link so that I can read about the site | MUST HAVE |
As a Site Admin I can create or update the About page content so that it is available on the site | COULD HAVE |
As a site user I can get all the contact information I need so that I can contact the site owners. | SHOULD HAVE |
As this would be a dual learning/building project using technologies that were new to me, such as Django, SQL, and Bootstrap, I was cautious to maintain consistent control over the scope of the project and not let my idea grow too big. With the sheer amount of files, I needed to lock down my project features early on into manageable blocks so as not to lose track of the MVP. Following my learning of the Django MVT framework I was able to identify how to change the templated structure to produce different website features from my base HTML. This allowed me to build upon my original idea of a 'Global Doctors blog' only, and to add a social experience around blog posts and shared images, and also to add a job section with additional features. Following Agile Planning Methodologies, I added my issues on my GitHub project board.
Essential features of my project were:
Planning my project thoroughly from the start allowed me to identify areas of importance for MVP completion and satisfaction of assessment criteria, and to balance them with the feasibility of the features.
To allow for ease of responsiveness, each section was designed keeping in mind the switch from 'row' to 'column' when moving from Desktop to Mobile/Tablet view. This approach allowed me to add more features to the project early on by reusing and repurposing sections of code.
Neutral colors were chosen for the background, navbar, footer, and buttons to keep them simple and not distracting. The main feature should be the attractive pictures and the stories behind them.
The photographs used on the blog are from either Pexels.com or Global Medical Staffing.com
All posts on the page are from Global Medical Staffing.com
Database Schema (ERD) for Global Doctors displaying relationships between feature components saved within the database
This Entity Relationship Diagram(ERD) demonstrates how each feature interacts with the other and the connected PostgreSQL Database. Using Django's User Model, and Django AllAuth to carry out all user authentication, a user has to choose whether they are an employer or regular user with specific CRUD functionality allowed to the different groups. A user_id is then created when the user registers with their username and email. This allows the user to edit a blank profile, create new blogs and add comments and in the case of employers create new jobs and in the case of regular users apply for the jobs and rate the jobs.
The Custom User Model and Profile Models were inspired by Django for Professionals 4.0, Author: Williams S. Vincent.
Blogs and Comments Models were inspired by the blog walkthrough Project by the Code Institute. They helped me to get a good and secure grasp of the templating structure and connected Python files to push my features further, make them my own, and then develop my Job and Jobapplication Models.
My Jobapplication Model collects data from the user about them and gives them the option of uploading a CV which is stored in Cloudinary. The Admin can check the applications and change the status from applied (default), to sent to employer, accepted and rejected. The applicant can view the status of their application on their profile.
Through the Admin Django Dashboard, the connected user_id to all data entered to the site means that the Admin can remove a User and their data completely through the addition of on_delete=models.CASCADE. At the moment, a user can remove any data they share with the site, but they cannot delete their account completely. This feature will come in the next version.
Several security steps were taken in this project to protect the user's submitted data. Unlike a strictly informative website, Global Doctors allows the user to become part of the community and avail of its job board services. To meet the strict internet standards of protecting a user's data, the following processes were included in the project's development.
AllAuth
Django AllAuth is an installable framework that takes care of the user registration and authentication process. Authentication was needed to determine when a user was registered or unregistered and it controlled what content was accessible on Global Doctors. The setup of AllAuth included:
Defensive Design
Global Doctors was developed to ensure a smooth user experience, to the best of my current learning experience with Django.
CSRF Tokens
CSRF (Cross-Site Request Forgery) tokens are included in every form to help authenticate the request with the server when the form is submitted. The absence of these tokens can leave a site vulnerable to attackers who may steal user´s data.
It was important to me from the beginning that Global Doctors be accessible to an unregistered user, in some capacities. I wanted the website to attract a new user quickly by immediately inviting them into the community through the site´s about us information, blogs, and especially the jobs section. The following is a breakdown of the site's accessibility for registered/unregistered users:
Feature | Unregistered User | Registered, Logged-In User |
---|---|---|
Home Page | Visible | Visible |
Profile | Not Visible - The 'Profile' icon only appears for registered, logged-in users | Visible and full feature interaction available |
Blogs | Visible but not interactable via 'Likes/Comments', 'Add Post' button not visible | Visible and full feature interaction available |
Jobs | Jobs visible | Visible but job creation, deletion, and editing possible only to employers |
About Us | Visible, links and map interaction available | Visible, links and map interaction available |
Contact | Visible and Form interaction available | Visible and Form interaction available |
Job application form | Visible with redirection to Registration Page after submission | Visible only to regular users with full feature interaction available but not employers |
Job Star Review | Visible | Visible to both employer and regular user |
Review page(to make reviews) | Not visible | Visible only after applying to a job for the first time by an applicant |
Users can Create, Read, Update and Delete their shared information on Global Doctors. Some features make full CRUD functionality available, whilst others present the necessary options only. Here is my CRUD breakdown for Global Doctors:
Feature | Create | Read | Update | Delete |
---|---|---|---|---|
Profile | Created upon registration | Yes | Yes | Full Profile deletion is currently only available to Admin upon User Account deletion, the profile dashboard clears automatically if a user removes all of their posts, job applications for applicants, and jobs for employers |
Posts | Yes | Yes | Yes | Yes |
Jobs(employers only) | Yes | Yes | Yes | Yes |
Job Application(only for applicants/regular users) | Yes | Yes | Yes | Yes |
Job review(only for applicants) | Yes(optional) | Yes | No | No |
Header/Navigation & Footer
Home Page
Registration
Users are required to add their Email(optional), Username, and Password twice, to ensure the correct one is saved. If any field is not filled in appropriately then a display message is used to inform the user how to proceed to complete the form. The Register and Login pages are created with default templates available with the AllAuth package. These templates are combined with the power of Bootstraps Crispy Forms pack to give extra control over the forms' appearance.
Login
On successful login, the user is greeted with feedback through a message that confirms the Login.
Login message
User is given feedback if they submit incorrect details where one item is correct and the other is incorrect
Django built-in field warnings for incorrect/forgotten fields input
Logout
A user may choose to return to the Home page and stay logged in or leave the site and log out.
User is given feedback in a message format to confirm log out, Profile icon no longer visible in navigation bar - message disappears after 4.5 seconds
Profile
The user profile is created upon registration and displays a placeholder image and 'Edit' button to allow the user to personalize their profile page. With future releases this page will be accessible to other users and allow connection, currently it is only viewable to the user.
Profile Edit
An Edit Profile page appears once the edit button is clicked on the profile page allowing users to edit their Profile Picture, Display Name and Bio (for regular users/applicants).
Blog
Unregistered Users have access to all blog posts available on Global Doctors. When registered and logged-in, they may access the 'Add Post' button, and 'Like/Unlike' icon and leave a comment. Posts created are displayed on individual 'cards' which display in rows for larger screens and columns for portrait, and mobile view.
Site pagination kicks in to display 6 posts per page. Buttons with next or prev at the base of the posts section allow users to move forward and back
Unregistered Users are free to read the posts and comments left on Global Doctors but they cannot 'Like/Comment' them until they have registered and logged in. The comment section has a link to the registration page.
A Likes and Comments counter is visible under every post. Logged-In Users can interact by clicking the heart outline to like. 'Heart outline' icon is replaced by filled Heart icon
The Likes icon is represented by an outlined heart icon. When it receives a like from the logged-in user, it becomes a filled heart icon and the user receives a success message.
A comment box is visible to all users but only logged-in users can leave a comment. Unregistered users can use the link in the comment box to register. Comments appear on the website once submitted and they can be edited or deleted only by their authors. This is a better user experience than having to wait for approval from the admin. If there are any inappropriate comments, the admin can delete them via the admin panel.
Comment is posted successfully message displayed after comment submission
For the author of the comment, when logged in, an edit button appears to allow them to edit the comment if they wish. The comment then reappears in the comment box where they can edit it and press the update button to submit the edited comment.
Comment is updated successfully message displayed after editing the comment
For the author of the comment, when logged in, a delete button will appear to allow them to delete the comment if they wish.
Create Blog Posts
The logged-in user may create a post and include their own image or allow a placeholder image. Feedback is given to the user to guide them if they do not fill out the required sections appropriately. The Submit button saves the post for Admin approval. Once approved, the post will appear on the main page. On their profile page the user can edit and delete their posts irrespective of draft or published status.
Admin approval is required for posts to keep Global Doctors on topic. Feedback is provided to the user by message that the post is awaiting approval
Edit Post
If a user spots a typo, or error or wants to add new information to their posts, then they may edit the post and submit. The posts that have draft status remain as drafts till the admin approves them. The posts that are already published can also be edited and resubmitted for immediate reposting. A certain amount of trust exists between Admin and the Global Doctors community to hope that no inappropriate or off-topic content will be shared, which will result in an immediate deletion of the user's account by the Admin. These issues will be locked down in the future development of Global Doctors to allow certain content/words to be flagged and removed by the Admin or not allow the form to be submitted in the first place. Community guidelines will also be developed.
Delete Post
User is informed that their post has been deleted - message disappears after 4.5 seconds
Jobs
User is informed that their job post has been published - message disappears after 4.5 seconds
For creating a job, the user is informed of the necessary fields to be filled in via feedback. Speciality is selectable via a dropdown menu. In the future authors can create new specialities if they need to. Start Date and End date are selectable for the duration of the jobs via a calendar widget. Neither date can be in the past and the end date can´t be before the start date. A summernote widget is provided for the Job Description.
Warning shown to Users if they choose a start date in the past.
*If an end date is before the start date then the user is informed via a warning message.
Delete Job
User is informed that their job has been deleted - message disappears after 4.5 seconds
Edit Job
User is informed that their job has been successfully edited - message disappears after 4.5 seconds
Job Application
User is informed that their job application has been submitted - message disappears after 4.5 seconds
During the job application process, the user is informed of the necessary fields to be filled in in the Form via feedback. The email address has to be a correct email address with the @ sign. They need to leave a short message to the employer. Adding their CV as a file document is optional. After pressing the submission button they are redirected to a job review page.
The applicant is asked to review the job with a staring system between 1-5. They are then redirected to the home page. Reviewing is optional, they can exit the page either through a link on the navbar or pressing the 'Return' button. In the background the highest amount of stars (5) given to a job is updated and shown to all users, even nonregistered users. No user can delete or edit the star reviews.
Edit Job Application
User is informed that their job application has been successfully edited - message disappears after 4.5 seconds
The status of their job applications returns to applied after every update, so that the admin can review the changes and forward the updated application to the employers.
Delete Job Application
A user may delete their job application.
User feedback is delivered by message once a job application has been deleted - message disappears after 4.5 seconds
About Us
This page offers the user business information including clickable telephone number and email address as well as the physical address. An embedded interactive Google Map allows the user to see Global Doctor's office location without leaving the site.
Contact
This page offers the user business information including clickable telephone number and email address as well as the physical address. In addition, there is a form for any user to fill out if they have enquires and are not yet ready to signup. Registered users can also use the form to send direct messages to the admin or site owners. In future iterations of the site, full email functionality will be added to this feature.
403, 404, 500 Pages
These templates were added to this project to give the user the functionality to return to the website by using the links in the navigation bar or the Back to Homepage button on the Error page.
Admin Panel
Through Django's built-in Administration Panel, the Admin has full access over the data submitted to the website by registered Users. To access the Admin panel the Admin user adds '/admin/' to the end of the URL to display https://traveldoc-0a6dba7e37c3.herokuapp.com/admin/. A username and password is requested. For Global Doctors, Admin approval is needed for blog posts to keep the site on topic and to prevent spamming. Registered, logged-in users have instant access to add a comment and like/unlike posts. Additionally, employers when logged in can add jobs and have full CRUD functionality over their job posts. Applicants once logged in can submit job applications with full CRUD functionality and also optionally submit a review of the job which can be read or optionally created but not deleted or updated. Those features will be added in the future.
Django Admin panel view for Global Doctors Administrator - content selection menu on left-hand side
Users' posts require approval by the Admin of Global Doctors to keep the website content on topic. Admin can change the status of posts from 'Draft' to 'Published'.
Admin can control users' comments via the Django Admin panel.
Admin can control users' posted jobs via the Django Admin panel.
Admin can create job specialities and post categories via the Django Admin panel.
Admin can control users' job applications via the Django Admin panel.
Admin can control users' profiles via the Django Admin panel.
Further information is available in the requirements.txt file
To begin this project from scratch, you must first create a new GitHub repository using the Code Institute's Template. This template provides the relevant tools to get you started. To use this template:
pip3 install 'django<4' gunicorn
pip3 install dj_database_url psycopg2
pip3 install dj3-cloudinary-storage
pip3 freeze --local > requirements.txt
command in the terminal. django-admin startproject traveldoc .
python3 mangage.py startapp blog
python3 manage.py createsuperuser
python3 manage.py migrate
import os
os.environ["DATABASE_URL"]="<copiedURLfrom Code Institutes PostgreSQL>"
os.environ["SECRET_KEY"]="my_super^secret@key"
For adding to settings.py:
import os
import dj_database_url
if os.path.exists("env.py"):
import env
SECRET_KEY = os.environ.get('SECRET_KEY')
(actual key hidden within env.py) DATABASES = {
'default': dj_database_url.parse(os.environ.get("DATABASE_URL"))
}
BASE_DIR
enter TEMPLATES_DIR = os.path.join(BASE_DIR, ‘templates’)
TEMPLATES = 'DIRS': [TEMPLATES_DIR]
with:os.path.join(BASE_DIR, 'templates'),
os.path.join(BASE_DIR, 'templates', 'allauth')
web: gunicorn traveldoc.wsgi
Cloudinary provides a cloud hosting solution for media storage. All users uploaded images in the Global Doctors project are hosted here.
Set up a new account at Cloudinary and add your Cloudinary API environment variable to your env.py and Heroku Config Vars. In your project workspace:
'cloudinary_storage',
'django.contrib.staticfiles',
'cloudinary',
os.environ["CLOUDINARY_URL"]="cloudinary://...."
STATIC_URL = '/static/'
STATICFILES_STORAGE = 'cloudinary_storage.storage.StaticHashedCloudinaryStorage'
STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static'), ]
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')
MEDIA_URL = '/media/'
DEFAULT_FILE_STORAGE = 'cloudinary_storage.storage.MediaCloudinaryStorage'
A new database instance can be created on Code Institute´s PostgreSQL or your database provider of choice for your project.
To start the deployment process, please follow the steps below:
Log in to Heroku or create an account if you are a new user.
Once logged in, in the Heroku Dashboard, navigate to the 'New' button in the top, right corner, and select 'Create New App'.
Enter an app name and choose your region. Click 'Create App'.
In the Deploy tab, click on the 'Settings', reach the 'Config Vars' section and click on 'Reveal Config Vars'. Here you will enter KEY:VALUE pairs for the app to run successfully. The KEY:VALUE pairs that you will need are your:
Add the Heroku host name into ALLOWED_HOSTS in your projects settings.py file -> ['herokuappname', ‘localhost’, ‘8000 port url’].
Once you are sure that you have set up the required files including your requirements.txt and Procfile, you have ensured that DEBUG=False, save your project, add the files, commit for initial deployment, and push the data to GitHub.
Go to the 'Deploy' tab and choose GitHub as the Deployment method.
Search for the repository name, select the branch that you would like to build from, and connect it via the 'Connect' button.
Choose from 'Automatic' or 'Manual' deployment options, I chose the 'Manual' deployment method. Click 'Deploy Branch'.
Once the waiting period for the app to build has finished, click the 'View' link to bring you to your newly deployed site. If you receive any errors, Heroku will display a reason in the app build log for you to investigate. DISABLE_COLLECTSTATIC may be removed from the Config Vars once you have saved and pushed an image within your project, as can PORT:8000.
A local clone of this repository can be made on GitHub. Please follow the below steps:
git clone
and paste in the copied URL from step 4.pip3 install -r requirements.txt
command, the dependencies and libraries needed for FreeFido will be installed.A copy of the original repository can be made through GitHub. Please follow the below steps to fork this repository:
Code Institute "I think therefore I blog" walkthrough helped me understand and set up the base code for Global Doctors.
Posts and images are from Global Medical Staffing
Additional images were from Pexels
I got additional inspiration from the following :