Django Project Documentation

Project Overview

This is a Django web application that demonstrates basic CRUD functionality with user registration. The project includes:

Hello World Page: A welcoming home page introducing the application
User Registration Page: A form for users to register with their information
Users List Page: A page to view all registered users with toggle view options
Static Files: Custom CSS styling and JavaScript for enhanced interactivity
Admin Panel: Django admin interface for managing users

Features

1. Hello World Page

Welcome message with project overview
Links to registration and user list pages
Responsive design with animated elements

2. User Registration

Form with fields: Username, Email, Full Name, Phone (optional)
Client-side and server-side validation
Success/error message feedback
Form styling with focus effects

3. Users Data Display

Table view of all registered users
Card view option (toggle between views)
Search functionality
User statistics
Responsive design for mobile devices

4. Static Files

CSS: Modern gradient design, animations, responsive layouts
JavaScript: Form validation, view toggling, search functionality, auto-hide messages

Project Structure

Python-Django/
├── manage.py                 # Django management script
├── myproject/               # Project settings directory
│   ├── __init__.py
│   ├── settings.py          # Project settings
│   ├── urls.py              # Main URL configuration
│   ├── asgi.py              # ASGI configuration
│   └── wsgi.py              # WSGI configuration
├── myapp/                   # Main application
│   ├── __init__.py
│   ├── admin.py             # Admin configuration
│   ├── apps.py              # App configuration
│   ├── forms.py             # Registration form
│   ├── models.py            # Database models
│   ├── views.py             # View functions
│   ├── urls.py              # App URL routing
│   ├── migrations/          # Database migrations
│   └── tests.py             # Tests
├── templates/               # HTML templates
│   ├── base.html            # Base template with navigation
│   ├── hello.html           # Hello World page
│   ├── register.html        # Registration form page
│   └── users_list.html      # Users list page
├── static/                  # Static files
│   ├── css/
│   │   └── style.css        # Custom CSS styles
│   └── js/
│       └── script.js        # JavaScript functionality
├── db.sqlite3              # SQLite database
├── .gitignore              # Git ignore file
├── README.md               # Project README
└── DOCUMENTATION.md        # This file

Installation and Setup

Prerequisites

Python 3.8 or higher
pip (Python package installer)

Step-by-Step Setup

1. Clone the Repository

git clone https://github.com/CSEdgeOfficial/Python-Django.git
cd Python-Django

2. Create Virtual Environment (Recommended)

# On Windows
python -m venv venv
venv\Scripts\activate

# On macOS/Linux
python3 -m venv venv
source venv/bin/activate

3. Install Django

pip install django

4. Apply Database Migrations

python manage.py makemigrations
python manage.py migrate

5. Create Superuser (Optional - for Admin Access)

python manage.py createsuperuser

Follow the prompts to create an admin account.

6. Run Development Server

python manage.py runserver

The application will be available at http://127.0.0.1:8000/

Usage Guide

Accessing the Application

Home Page: Navigate to http://127.0.0.1:8000/
- View the Hello World page
- Access navigation links
Register a User: Click "Register Now" or navigate to http://127.0.0.1:8000/register/
- Fill in the registration form
- Submit to create a new user
- View success message
View Users: Click "View Users" or navigate to http://127.0.0.1:8000/users/
- See all registered users in table format
- Toggle to card view using the "Toggle View" button
- Use the search box to filter users
- View total user count
Admin Panel: Navigate to http://127.0.0.1:8000/admin/
- Log in with superuser credentials
- Manage users through the admin interface

Database Schema

UserRegistration Model

Field	Type	Description
id	AutoField	Primary key (auto-generated)
username	CharField	Unique username (max 100 char)
email	EmailField	Unique email address
full_name	CharField	User's full name (max 200)
phone	CharField	Phone number (optional, max 20)
created_at	DateTimeField	Registration timestamp

Technical Details

Backend

Framework: Django 6.0
Database: SQLite (default)
ORM: Django ORM
Forms: Django ModelForm
Admin: Django Admin Interface

Frontend

HTML5: Semantic markup
CSS3: Custom styling with gradients, animations, flexbox, grid
JavaScript: Vanilla JS for interactivity
Design: Responsive mobile-first approach

Key Django Concepts Used

Models: ORM-based data modeling
Views: Function-based views
Templates: Django template language with inheritance
Forms: ModelForm for data validation
URL Routing: URLconf for mapping URLs to views
Static Files: CSS and JavaScript serving
Messages Framework: User feedback
Admin Interface: Model administration

Features Explanation

CSS Features

Gradient Backgrounds: Modern purple gradient design
Animations: Fade-in, slide-in effects
Responsive Design: Mobile-friendly layout
Hover Effects: Interactive elements
Form Styling: Custom input designs with focus states

JavaScript Features

Form Validation: Real-time input validation
View Toggle: Switch between table and card views
Search: Filter users dynamically
Auto-hide Messages: Messages disappear after 5 seconds
Button Ripple Effect: Material design-inspired interactions
Smooth Scrolling: Enhanced navigation

Customization

Changing Colors

Edit static/css/style.css and modify the gradient colors:

background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

Adding New Fields

Update myapp/models.py to add new fields
Update myapp/forms.py to include new fields
Update templates to display new fields
Run migrations: python manage.py makemigrations && python manage.py migrate

Modifying Styles

All CSS is in static/css/style.css. Modify classes and styles as needed.

Adding JavaScript Functionality

Edit static/js/script.js to add new interactive features.

Testing

Manual Testing Checklist

Running Django Tests

python manage.py test myapp

Troubleshooting

Issue: Static files not loading

Solution: Run python manage.py collectstatic or ensure DEBUG = True in settings.py

Issue: Database errors

Solution: Delete db.sqlite3 and run migrations again:

rm db.sqlite3
python manage.py migrate

Issue: Port already in use

Solution: Run server on different port:

python manage.py runserver 8001

Issue: CSS/JS changes not reflecting

Solution: Hard refresh browser (Ctrl+Shift+R) or clear browser cache

Security Considerations

⚠️ Important: This is a development project. Before deploying to production:

Set DEBUG = False in settings.py
Change SECRET_KEY to a secure random value
Configure ALLOWED_HOSTS
Use environment variables for sensitive data
Set up HTTPS
Use a production database (PostgreSQL, MySQL)
Configure static files serving with WhiteNoise or CDN
Add CSRF protection middleware (already included)
Implement proper authentication
Add rate limiting

Future Enhancements

Potential features to add:

User authentication (login/logout)
Password protection for user accounts
User profile editing
Email verification
Pagination for users list
Export users to CSV/PDF
User profile pictures
Advanced search and filtering
REST API with Django REST Framework
Unit and integration tests

Contributing

To contribute to this project:

Fork the repository
Create a feature branch
Make your changes
Test thoroughly
Submit a pull request

License

This project is open-source and available for educational purposes.

Support

For issues or questions:

Open an issue on GitHub
Check Django documentation: https://docs.djangoproject.com/

Credits

Built with:

Django - https://www.djangoproject.com/
Python - https://www.python.org/

Last Updated: December 2024 Version: 1.0.0

FilesExpand file tree

DOCUMENTATION.md

Latest commit

History