Loading

Kudrotullah (David Kudrot) Portfolio

A stunning, fully dynamic developer portfolio built with Django 5 + Tailwind CSS 4. Everything is manageable from the Django admin panel.

Kudrotullah (David Kudrot) Portfolio

David Kudrot Portfolio

πŸ“‹ Overview

A stunning, fully dynamic developer portfolio built with Django 5 and Tailwind CSS 4. Features a deep space aesthetic with complete content management through Django's admin panel.

πŸ—οΈ Architecture & Setup

  • Modular Django Structure – Organized into six separate apps following Django best practices

  • Virtual Environment – Isolated Python environment with pip and requirements.txt

  • Database Setup – SQLite for development with easy migration to PostgreSQL for production

  • Fixture Data – Pre-loaded sample data for quick testing and demonstration

  • Automated Setup Script – One-command installation script for new developers

🎨 Frontend Design

  • Dark Theme Aesthetic – Deep space color scheme with violet and amber accents

  • Glassmorphism Cards – Modern frosted glass effects with backdrop blur

  • Animated Gradients – Smooth, eye-catching gradient animations throughout

  • Typewriter Effect – Dynamic text rotation in the hero section

  • Fully Responsive – Perfectly optimized for mobile, tablet, and desktop views

  • Tailwind CSS 4 – Utility-first styling with custom color configuration

βš™οΈ Backend Features

  • Django 5 Framework – Latest Django version with robust security and ORM

  • Custom Admin Panel – Full content management with intuitive interface

  • Singleton Settings – Global site configuration managed through admin

  • CKEditor Integration – Rich text editing for blog posts and content

  • Image Processing – Automatic image resizing and optimization

  • django-taggit – Flexible tagging system for projects and blog posts

πŸ“± Core Applications

Core App

  • Site settings and configuration

  • Profile management with photo upload

  • Contact form with database storage

  • Social media links management

  • Typewriter text customization

Portfolio App

  • Project showcase with screenshots

  • Tech stack tagging and filtering

  • Project links (live demo, GitHub)

  • Featured project highlighting

Blog App

  • Rich text blog posts with CKEditor

  • Post categorization and tagging

  • Publication date management

  • SEO-friendly URL slugs

Skills App

  • Skill categories and groupings

  • Progress bar visualization

  • Proficiency level indicators

  • Sortable skill ordering

Testimonials App

  • Client reviews and feedback

  • Author information and photos

  • Rating or recommendation level

  • Approval workflow management

Analytics App

  • Page view tracking

  • Visitor statistics

  • Popular content identification

  • Basic engagement metrics

πŸ”§ Admin Management

 
 
Section Management Capabilities
Site Settings Name, email, social links, Google Analytics ID
Profile Name, title, bio, photo, typewriter texts
Services Service cards with descriptions
Projects Portfolio items, screenshots, tech stack
Blog Posts with rich text editor and tags
Skills Categories and progress bars
Testimonials Client reviews with photos
Navigation Custom menu links and ordering
Messages Contact form submissions
Analytics Page view logs and reports

πŸš€ Performance & SEO

  • WhiteNoise Integration – Efficient static file serving

  • Compressed Assets – Optimized CSS and JavaScript

  • SEO-Friendly URLs – Clean, descriptive URL structures

  • Meta Tags – Dynamic meta descriptions and keywords

  • Sitemap Ready – Easy sitemap.xml generation

  • Environment Configuration – Secure settings management

πŸ› οΈ Technology Stack

Backend

  • Django 5.0

  • Python 3.11+

  • SQLite/PostgreSQL

  • WhiteNoise

  • Gunicorn

Frontend

  • Tailwind CSS 4

  • Vanilla JavaScript

  • Tinymce
  • Responsive Images

Python Packages

  • Pillow – Image processing

  • django-resized – Image optimization

  • django-taggit – Content tagging

  • python-dotenv – Environment variables

  • django-ckeditor – Rich text editing

πŸ“¦ Installation Steps

bash
# Clone the repository
git clone <repository-url>
cd david_portfolio

# Create virtual environment
python -m venv venv
source venv/bin/activate  # Windows: venv\Scripts\activate

# Install dependencies
pip install -r requirements.txt

# Run database migrations
python manage.py makemigrations
python manage.py migrate

# Load sample data
python manage.py loaddata fixtures/initial_data.json

# Create admin user
python manage.py createsuperuser

# Start development server
python manage.py runserver

πŸ” Environment Variables

text
DEBUG=False
SECRET_KEY=your-secret-key
ALLOWED_HOSTS=yourdomain.com
DATABASE_URL=postgres://user:pass@localhost/dbname

🌐 Deployment Ready

  • Platform Agnostic – Works on Heroku, PythonAnywhere, DigitalOcean, or any VPS

  • Static Files – Configured with WhiteNoise for production

  • Database Flexibility – Easy switch from SQLite to PostgreSQL

  • Security Settings – Production-ready security configurations

  • Environment Variables – Secure credential management

πŸ“Š Key Features Summary

  • βœ… Complete admin content management

  • βœ… Stunning dark theme with animations

  • βœ… Responsive mobile-first design

  • βœ… Blog with rich text editor

  • βœ… Portfolio project showcase

  • βœ… Skills with progress visualization

  • βœ… Testimonials management

  • βœ… Contact form with database storage

  • βœ… Analytics tracking

  • βœ… SEO optimization

  • βœ… Sample data fixtures

  • βœ… One-command setup script

🎯 Perfect For

  • Developers needing a professional portfolio

  • Freelancers wanting to showcase work

  • Django developers learning best practices

  • Anyone wanting a manageable, dynamic website

Tech Stack

Django PostgreSQL Python Tailwind

Screenshots