PROJECT REPORT ON

INDUSTRIAL TRAINING

SESSION 2021-2025

SUBMITTED BY: SUBMITTED TO:

Aditya Suthar (21EEBCS007) Dr. Narpat Singh Sekhawat

(Assistant Professor)
Department of CSE

DEPARTMENT OF COMPUTER SCIENCE

GOVERNMENT ENGINEERING COLLEGE BIKANER
(SUBMITTED ON: 10/12/2024)
 Acknowledgment

I would like to express my heartfelt gratitude to all those who have contributed to the successful
completion of this project, Contact Management Application.
First and foremost, I am deeply thankful to my college, Engineering College Bikaner, for
allowing me to work on this project and guiding me throughout my academic journey. I sincerely
thank my faculty members for their valuable advice and consistent encouragement.
I am immensely grateful to Sudaku CodeClause Private Limited, where I interned from July 15
to August 15, for providing me with practical exposure to real-world software development
practices. This experience has significantly enhanced my technical knowledge and inspired the
development of this project.
I also wish to acknowledge the unwavering support of my family and friends, whose
encouragement motivated me to strive for excellence during the project.
Finally, I would like to thank my peers and anyone who directly or indirectly supported me in
completing this project. Their input and feedback were invaluable in refining the final output.
This project has been a remarkable learning experience, and I truly appreciate all the support and
guidance I have received during its development.

Aditya Suthar
B.Tech., Computer Science Engineering
Engineering College Bikaner
 Abstract

In today's fast-paced digital world, managing contacts effectively is essential for both personal
and professional purposes. The Contact Management Application is a web-based solution
designed to provide users with a secure, user-friendly platform to store, organize, and manage
their contact information.
The primary objective of this application is to simplify contact management by offering
functionalities such as adding, editing, and deleting contact details. Users can create individual
accounts and log in to access a personalized interface where their contact information is securely
stored. Robust user authentication ensures privacy and data integrity.
Developed using Django for the backend and Bootstrap for the frontend, the application features
a responsive and visually appealing design, making it accessible from any device with an internet
connection. The project emphasizes secure data handling, intuitive navigation, and seamless
functionality.
This application has practical utility in various scenarios, including professional networking,
personal record keeping, and collaborative environments where managing contact details
efficiently is paramount. The implementation of secure account management ensures that each
user's data is private and exclusive.
The scope of this project includes the development of a fully functional web application that
leverages modern technologies and provides an accessible, centralized contact management
solution for end users.
 Aditya Suthar
Fashion Khan
has successfully completed the internship as a Web Development Intern
at Sudaku CodeClause Private Limited (an ISO 9001:2015 certified organization)
from 15 July 2024 to 15 Aug 2024

Aug 15, 2024

ID- CC-CL94904
 Table of Contents
1. Introduction…………………………………………………………………………….02
2. Project Overview……………………………………………………..………………...04
3. Technology Stack……………………………………………………..………………..06
4. Project Setup…………………………………………………………..……………….08
5. Features………………………………………………………………..……………….10
6. Detailed Code Explanation……………………………………………………………..12
7. Screenshots and Descriptions……………………………………………….………….18
8. Testing……………………………………………………………………….………….24
9. Conclusion…………………………………………………………………..…………..26
10. References………………………………………………………………………………28
 1. Introduction
In today's digital age, managing contacts efficiently is crucial for both personal and professional
purposes. The Contact Management Application is designed to help users store, organize, and
manage their contact information in a streamlined and user-friendly manner.

This project aims to provide a secure and accessible platform where users can create an account,
log in, and manage their contacts effortlessly. The application offers features such as adding new
contacts, editing existing contact details, and deleting contacts that are no longer needed. Each
user's contact data is stored securely, ensuring privacy and data integrity.

The purpose of this application is to simplify the process of contact management by offering a
centralized system accessible from any device with an internet connection. The scope of the
project includes the development of a fully functional web application with a focus on user
authentication, responsive design, and efficient data handling. By leveraging technologies such
as Django for the backend and Bootstrap for the frontend, this project ensures a robust and
visually appealing interface for end users.
 2. Project Overview
The Contact Management Application is designed to offer users a comprehensive solution for
managing their contact information. This web-based application allows users to perform various
tasks related to their contacts in a seamless and efficient manner. Below is a detailed description
of the main functionalities and key features of the application.

Main Functionalities

1. User Authentication: Users can register for a new account or log in to an existing
account. The authentication system ensures that only authorized users can access their
contact information.
2. Contact Management: Users can add new contacts by filling out a form with details
such as name, email, phone number, and address. Each contact is saved securely in the
database.
3. Editing Contacts: Users can update the details of existing contacts. This functionality
allows for easy modifications and ensures that contact information remains current.
4. Deleting Contacts: Users can delete contacts that are no longer needed. This helps keep
the contact list organized and relevant.
5. Viewing Contacts: Users can view a list of their contacts, which is displayed in a
user-friendly manner. The contact list is accessible only to the logged-in user, ensuring
privacy.

Key Features and Benefits

 1. User-Specific Data: Each user has their own account, and their contacts are stored
separately from other users' data. This ensures that users see only their own contacts,
maintaining privacy and security.
2. Responsive Design: The application is built with Bootstrap, ensuring that the user
interface is responsive and works well on various devices, including desktops, tablets,
and smartphones.
3. Intuitive Interface: The application features a clean and intuitive interface, making it
easy for users to navigate and manage their contacts without any technical expertise.
4. Secure Data Handling: The application uses Django's robust security features to protect
user data. All sensitive information, including passwords, is encrypted and securely
stored.
5. Scalability: The application is designed to scale easily, allowing for future enhancements
and additional features without major rework.
6. Efficient Data Management: Users can quickly search and sort their contacts, making it
easy to find specific information when needed.

By providing these functionalities and features, the Contact Management Application aims to
offer a reliable and efficient solution for managing personal and professional contacts. Users will
benefit from a secure, organized, and accessible system that simplifies the process of contact
management.
 3. Technology Stack
The Contact Management Application utilizes a variety of technologies to ensure a robust,
secure, and user-friendly experience. Below is a list of the key technologies used in the
development of the application:

1. Django: A high-level Python web framework that encourages rapid development and
clean, pragmatic design. Django is used for the backend development of the application,
providing powerful features such as an ORM (Object-Relational Mapping), form
handling, and authentication.
2. Bootstrap 5: A popular CSS framework that allows for responsive and mobile-first web
development. Bootstrap 5 is used for styling the frontend of the application, ensuring a
modern and consistent user interface across different devices.
3. SQLite: A lightweight, disk-based database that doesn’t require a separate server process.
SQLite is used as the database for the development and testing phases of the application,
providing efficient data storage and retrieval.
4. HTML5: The standard markup language used for creating web pages. HTML5 is used to
structure the content of the web pages within the application.
5. CSS3: The latest evolution of the Cascading Style Sheets language, used to style the
HTML elements on the web pages. CSS3 is used alongside Bootstrap to provide
additional custom styling.
6. JavaScript: A programming language that allows for the creation of dynamic and
interactive web content. JavaScript is used to enhance the user experience by providing
client-side validation and other interactive features.
7. jQuery: A fast, small, and feature-rich JavaScript library. jQuery simplifies HTML
document traversal and manipulation, event handling, and animation, making it easier to
implement dynamic content.
8. Python: A high-level, interpreted programming language known for its readability and
simplicity. Python is used for server-side scripting and application logic in the Django
framework.
 9. Git: A distributed version control system used for tracking changes in the source code
during development. Git allows multiple developers to collaborate on the project
efficiently.
10. GitHub: A web-based platform used for version control and collaborative development.
The source code for the project is hosted on GitHub, providing a centralized repository
for managing code changes and project documentation.
11. Visual Studio Code: A source-code editor made by Microsoft. It includes support for
debugging, embedded Git control, syntax highlighting, intelligent code completion,
snippets, and code refactoring. Visual Studio Code is used as the primary development
environment for writing and editing code.

By leveraging these technologies, the Contact Management Application ensures a high level of
performance, security, and usability for end users.
 4. Project Setup
Setting up the Contact Management Application locally involves several steps. Below are the
detailed instructions to get the project up and running on your local machine.

Prerequisites

Before you begin, ensure that you have the following software installed on your system:

1. Python: Version 3.6 or higher.

2. Git: For version control and cloning the project repository.
3. Virtualenv: To create isolated Python environments.

Installation Steps

Follow these steps to set up the project locally:

1. Clone the Repository:

○ Open your terminal or command prompt.
○ Clone the project repository from GitHub.
■ git clone https://github.com/adityasuthar/contacts-app.git
○ Navigate to the project directory:
■ cd contact-management-app

2. Create a Virtual Environment:

○ Create a virtual environment to manage project dependencies: python -m venv
venv
○ Activate the virtual environment:
■ On Windows: venv\Scripts\activate
■ On macOS/Linux: source venv/bin/activate
 3. Install Dependencies:
○ Install the required Python packages using pip: pip install -r requirements.txt

4. Apply Migrations:
○ Run the following command to apply database migrations: python manage.py
migrate

5. Create a Superuser:
○ Create a superuser account to access the Django admin panel: python manage.py
createsuperuser
○ Follow the prompts to set up the superuser account.

6. Run the Development Server:

○ Start the Django development server: python manage.py runserver
○ Open your web browser and go to http://127.0.0.1:8000/ to access the application.

7. Access the Admin Panel:

○ Go to http://127.0.0.1:8000/admin and log in with the superuser credentials
created earlier to manage the application's data.

By following these steps, you will have the Contact Management Application running on your
local machine. You can now explore and interact with the application's features.
 5. Features
The Contact Management Application is designed to provide a seamless experience for users to
manage their contacts efficiently. Below are the main features of the application:

User Authentication (Registration and Login)

The application includes a robust user authentication system that ensures secure access to user
data. The key components of this feature are:

● Registration: New users can create an account by providing their username, email, and
password. The registration process includes form validation to ensure that all required
fields are filled out correctly and that the password meets security requirements.
● Login: Registered users can log in to the application using their username and password.
The login process includes authentication checks to verify the user's credentials and
provide access to their contact data.
● Password Management: Users can reset their passwords if they forget them, ensuring
they can always regain access to their account.

Adding Contacts

Users can add new contacts to their contact list. This feature includes:

● Contact Form: A form where users can enter contact details such as name, email, phone
number, and address.
● Form Validation: The form includes validation to ensure that all required fields are filled
out correctly and that the data entered is in the correct format.
● Data Storage: Once the form is submitted, the contact information is securely stored in
the database, associated with the user's account.

Editing Contacts

Users can edit the details of existing contacts. This feature includes:
 ● Edit Form: A form similar to the add contact form, pre-filled with the existing contact
details.
● Form Validation: The form includes validation to ensure that the updated information is
correct and complete.
● Data Update: When the form is submitted, the updated contact information is saved in
the database, replacing the old data.

Deleting Contacts

Users can delete contacts that are no longer needed. This feature includes:

● Delete Confirmation: Before a contact is deleted, the user is asked to confirm the
deletion to prevent accidental data loss.
● Data Removal: Once confirmed, the contact is removed from the database.

Viewing Contacts Specific to Each User

Users can view a list of their contacts in a user-friendly interface. This feature includes:

● Contact List: A list view that displays all contacts associated with the logged-in user.
Each contact's name, email, phone number, and address are displayed.
● Search and Filter: Users can search and filter their contacts to quickly find specific
information.
● Responsive Design: The contact list is designed to be responsive, ensuring it looks good
and is easy to use on both desktop and mobile devices.

These features collectively ensure that users have complete control over their contact
information, making it easy to add, edit, delete, and view contacts in a secure and organized
manner.
 6. Detailed Code Explanation
This section provides a detailed explanation of the code used in the Contact Management
Application. It includes code snippets for each part of the application along with explanations.

Models

User Model: The User model is provided by Django's built-in authentication system, which
handles user authentication and management. There's no need to create a custom User model
unless you want to add extra fields.

Contact Model: The Contact model represents the contact information associated with each
user.

Explanation:

● user: This is a ForeignKey field linking the Contact model to the User model. It
establishes a many-to-one relationship, meaning each contact belongs to one user, but
each user can have multiple contacts. The on_delete=models.CASCADE argument
ensures that when a user is deleted, all their associated contacts are also deleted.
 ● name, email, phone, address: These fields store the contact's name, email address, phone
number, and physical address, respectively. Each field is of a specific type (CharField,
EmailField, etc.) to enforce data validation.
● __str__: This method returns the name of the contact when the object is printed or
displayed in the Django admin interface.

Views

ContactListView: Displays the list of contacts for the logged-in user.

Explanation:

● contact_list: This function-based view handles displaying the list of contacts. It first
filters the Contact objects to retrieve only those that belong to the logged-in user
(request.user).
● render: The render function takes the request, the template name
(contacts/contact_list.html), and a context dictionary containing the contacts to be passed
to the template for rendering.

ContactCreateView: Handles the creation of new contacts.

Explanation:

● contact_create: This function-based view handles both displaying the form for creating a
new contact and processing the form submission.
● request.method == 'POST': Checks if the form is submitted via POST.
● form.is_valid(): Validates the form data.
● form.save(commit=False): Creates a Contact instance but does not save it to the database
yet. This allows setting additional fields (e.g., user).
● contact.user = request.user: Sets the user field of the contact to the logged-in user.
● contact.save(): Saves the contact to the database.
● redirect('contact_list'): Redirects the user to the contact list view after successfully saving
the contact.
● render: If the request method is not POST, or if the form is not valid, it renders the form
template (contacts/contact_form.html) with an empty or invalid form.

Templates

contact_list.html: Displays the list of contacts.

Explanation:

● {% extends 'base_generic.html' %}: Inherits from a base template to maintain a

consistent layout across different pages.
● {% block content %}: Defines a block named content to be filled with specific content
for this template.
● {% for contact in contacts %}: Iterates over the contacts context variable, displaying each
contact's details.
● <a href="{% url 'contact_create' %}">Add New Contact</a>: A link to the contact
creation view.
contact_form.html: Displays the form for creating or editing a contact.

Explanation:

● {% csrf_token %}: Includes a CSRF token for security purposes, preventing cross-site
request forgery.
● {{ form.as_p }}: Renders the form fields as paragraphs.
● <button type="submit">Save</button>: A submit button to submit the form.
● <a href="{% url 'contact_list' %}">Back to Contact List</a>: A link to navigate back to
the contact list view.

Forms

ContactForm: Defines the form for creating and editing contacts.

Explanation:

● ContactForm: A ModelForm class that provides a form based on the Contact model.
● Meta: A nested class that defines metadata for the form.
● model = Contact: Specifies that the form is based on the Contact model.
● fields = ['name', 'email', 'phone', 'address']: Specifies the fields to be included in the form.

URLs

urlpatterns: Defines the URL patterns for the application.

Explanation:

● urlpatterns: A list of URL patterns that maps URL paths to views.

● path('', views.contact_list, name='contact_list'): Maps the root URL to the contact_list
view and names it 'contact_list'.
● path('create/', views.contact_create, name='contact_create'): Maps the URL /create/ to the
contact_create view and names it 'contact_create'.
 7. Screenshots and Descriptions
This section includes screenshots of different pages of the Contact Management Application
along with brief descriptions of each page, explaining what the user can do on each.

7.1 Registration Page

Screenshot:

Description: The login page allows registered users to log in to the application. Users must enter
their username and password. The system authenticates the credentials and, upon successful
login, redirects the user to their contact list page.

7.2 Login Page

Screenshot:

Description: The login page allows registered users to log in to the application. Users must enter
their username and password. The system authenticates the credentials and, upon successful
login, redirects the user to their contact list page.
7.3 Contact List Page

Screenshot:

Description: The contact list page displays all the contacts associated with the logged-in user.
Each contact's name, email, phone number, and address are listed. Users can add new contacts
using the "Add New Contact" link. This page also provides options to edit or delete existing
contacts.
7.4 Add Contact Page

Screenshot:

Description: The add contact page provides a form for users to enter the details of a new contact,
including the name, email, phone number, and address. After filling out the

form, users can save the contact by clicking the "Save" button. The new contact is then added to
the user's contact list.
7.5 Edit Contact Page

Screenshot:

Description: The edit contact page is similar to the add contact page but is pre-filled with the
existing contact details. Users can update the information and save the changes. This allows
users to keep their contact information up-to-date.
7.6 Delete Contact Confirmation

Screenshot:

Description: Before deleting a contact, the application asks for confirmation to prevent
accidental deletions. This page displays the contact details and asks the user to confirm or cancel
the deletion.
 8. Testing
Testing is a crucial part of the development process to ensure the Contact Management
Application functions as expected and is free of bugs. This section describes how the application
was tested and the tools and frameworks used.

8.1 Manual Testing

Manual testing was performed to verify the application's functionality and user interface. The
following scenarios were tested:

● User Registration: Ensured that new users can successfully create an account with valid
data, and appropriate error messages are shown for invalid inputs.
● User Login: Verified that registered users can log in with correct credentials and receive
error messages for incorrect credentials.
● Adding Contacts: Confirmed that users can add new contacts and that the contact details
are correctly saved in the database.
● Editing Contacts: Checked that users can edit existing contacts and that changes are
accurately reflected in the contact list.
● Deleting Contacts: Ensured that users can delete contacts and that the contacts are
removed from the database.
● Contact List Display: Verified that the contact list displays all contacts associated with
the logged-in user and that no contacts from other users are shown.
● Form Validation: Tested form validations to ensure required fields are filled, email
addresses are in the correct format, and phone numbers meet the specified criteria.

8.2 Browser Testing

The application was also tested across different web browsers to ensure cross-browser
compatibility. The following browsers were used for testing:

● Google Chrome
● Mozilla Firefox
 ● Microsoft Edge
● Safari

Each feature and functionality was tested to confirm that the application behaves consistently
across these browsers.

8.3 Testing Tools

● Django Test Framework: Used for writing unit and integration tests.
● Selenium: A browser automation tool that was used for end-to-end testing to simulate
user interactions and verify that the application functions correctly from the user's
perspective.
● Coverage: A tool used to measure code coverage, ensuring that the tests adequately
cover the application's codebase.

By combining manual testing, automated testing, and cross-browser testing, we ensured that the
Contact Management Application is robust, reliable, and provides a consistent user experience.
 9. Conclusion

Summary

The Contact Management Application is a comprehensive tool designed to help users efficiently
manage their contact information. Developed using Django and styled with Bootstrap 5, the
application provides key features such as user authentication, contact addition, editing, deletion,
and a personalized contact list view. By integrating these functionalities, the application ensures
a user-friendly experience while maintaining data security and integrity.

Challenges and Solutions

1. User Authentication: Challenge: Implementing a secure authentication system to ensure only

authorized users can access their contact information. Solution: Utilized Django’s built-in
authentication system, which provides robust security features. Implemented additional measures
like password validation and CSRF protection to enhance security.

2. Contact Visibility: Challenge: Ensuring that contacts are visible only to their respective
owners and not to other users. Solution: Applied user-specific filtering in the views to ensure
that each user can only see their contacts. Implemented access controls and validation checks to
maintain data privacy.

3. Form Validation: Challenge: Ensuring that user inputs are validated and correctly handled to
prevent errors and invalid data from being saved. Solution: Leveraged Django’s form validation
mechanisms and implemented custom validation rules where necessary. Provided clear error
messages and user feedback to guide users in correcting any issues.

4. Cross-Browser Compatibility: Challenge: Ensuring the application performs consistently

across different web browsers and devices. Solution: Conducted extensive testing across
multiple browsers (Chrome, Firefox, Edge, Safari) and devices to ensure consistent behavior and
appearance. Applied responsive design principles to adapt the application’s layout to various
screen sizes.
Potential Future Improvements

1. Enhanced User Interface: Future updates could include enhancements to the user interface to
improve aesthetics and usability. This might involve redesigning certain elements or
incorporating additional interactive features.

2. Advanced Contact Management: Introducing advanced features such as contact grouping,

tagging, and search functionality would further enhance the user experience. Users could benefit
from more sophisticated tools to organize and find their contacts more efficiently.

3. Integration with External Services: Integration with external services like email clients or
social media platforms could provide additional functionality, such as importing contacts or
syncing contact information across multiple platforms.

4. Mobile Application: Developing a mobile version of the application or a dedicated mobile

app could extend its accessibility and usability for users on the go. This would involve adapting
the design for mobile devices and ensuring a seamless experience across platforms.

5. Enhanced Security Features: Implementing additional security features, such as two-factor

authentication and improved encryption, could further safeguard user data and protect against
potential threats.

Overall, the Contact Management Application provides a solid foundation for managing contact
information and offers a user-friendly experience. The project successfully addressed the
challenges encountered and laid the groundwork for future enhancements that could significantly
improve its functionality and usability.
 10. References

This section lists the references and resources used in the development of the Contact
Management Application. These resources provided valuable information, tools, and frameworks
that contributed to the project's success.

1. Django Documentation

● URL: Django Documentation

● Description: The official documentation for Django, which includes comprehensive
guides on installation, models, views, templates, forms, and more. It was a primary
resource for understanding Django’s features and best practices.

2. Bootstrap 5 Documentation

● URL: Bootstrap 5 Documentation

● Description: The official Bootstrap documentation provided guidelines and examples for
styling and designing responsive web pages using Bootstrap 5. It was used to ensure a
modern and consistent user interface.

3. Django REST Framework Documentation

● URL: Django REST Framework

● Description: While not directly used in this project, the documentation for Django REST
Framework was referenced for potential future enhancements involving API
development.

4. W3Schools

● URL: W3Schools
● Description: An online resource for HTML, CSS, and JavaScript tutorials and
references. It was useful for troubleshooting and implementing front-end features.
5. Stack Overflow

● URL: Stack Overflow

● Description: A community-driven Q&A platform where various coding issues and
questions were addressed. It provided solutions to specific problems encountered during
development.

6. GitHub

● URL: GitHub
● Description: A platform for version control and collaboration. The project repository on
GitHub allowed tracking changes, collaborating with others, and integrating with various
tools.

7. Selenium Documentation

● URL: Selenium Documentation

● Description: Documentation for Selenium, a browser automation tool used for
end-to-end testing. It provided guidance on writing and running automated tests for the
application.

8. Django Testing Tools

● URL: Django Testing Tools

● Description: The official Django testing guide, which offered insights into writing unit
tests and integration tests to ensure application functionality and reliability.

9. Coverage.py Documentation

● URL: Coverage.py Documentation

● Description: Documentation for Coverage.py, a tool used to measure code coverage and
ensure that tests adequately cover the codebase.