mohamad
6.9 KiB
6.9 KiB
Tecvico Website
Django MVT informational website for Tecvico Corp (formerly Visera), showcasing the ViSERA medical imaging and radiomics software suite.
Tech Stack
| Layer | Technology |
|---|---|
| Backend | Django 5.1 (MVT) |
| Database | PostgreSQL 16 |
| Static files | WhiteNoise (with Brotli compression) |
| Application server | Gunicorn |
| Containerization | Docker + Docker Compose |
| Frontend | Vanilla HTML/CSS/JS (no framework) |
Project Structure
tecvico_website/
├── config/ # Django project configuration
│ └── settings/
│ ├── base.py # Shared settings
│ ├── development.py # Dev settings (DEBUG=True, dotenv)
│ └── production.py # Production settings (security headers)
├── apps/
│ ├── core/ # Context processors, management commands
│ │ └── management/commands/seed_content.py
│ ├── products/ # MainProduct, SubProduct, Article, ArticleSection
│ └── pages/ # FAQEntry, DownloadItem; static pages
├── templates/ # Global templates
│ ├── base.html
│ ├── partials/
│ └── pages/ & products/
├── static/
│ ├── css/main.css # Full design system (dark glass/ice theme)
│ └── js/main.js # Navbar, FAQ accordion, scroll effects
├── Dockerfile
├── docker-compose.yml # Production compose
├── docker-compose.override.yml # Development compose overrides
└── entrypoint.sh # DB wait + migrate on container start
URL Map
| URL | View | Description |
|---|---|---|
/ |
HomeView |
Landing page |
/about/ |
AboutView |
What is Tecvico |
/products/ |
ProductOverviewView |
All main products |
/products/<main-slug>/ |
MainProductDetailView |
Main product + sub-products |
/products/<main-slug>/<sub-slug>/ |
SubProductDetailView |
Sub-product + articles |
/downloads/ |
DownloadsView |
Download items by platform |
/faq/ |
FAQView |
FAQ entries |
/contact/ |
ContactView |
Contact info |
/admin/ |
Django Admin | Admin panel |
Data Model
MainProduct
└── SubProduct (FK → MainProduct)
└── Article (FK → SubProduct)
└── ArticleSection (FK → Article) ← key/value metadata
FAQEntry ← admin-managed FAQ items
DownloadItem ← admin-managed download links per platform
Local Development (with Docker)
Prerequisites
- Docker Desktop (or Docker Engine + Compose plugin)
1. Clone & configure
git clone <repo-url> tecvico_website
cd tecvico_website
cp .env.example .env
Edit .env and set at minimum:
DJANGO_SECRET_KEY=your-very-secure-random-key
POSTGRES_PASSWORD=choose-a-strong-password
2. Start services (development mode)
The docker-compose.override.yml automatically activates when you run docker compose up, mounting the source code and using the development settings.
docker compose up --build
The app is available at http://localhost:8000
3. Create a superuser
docker compose exec web python manage.py createsuperuser
4. Seed initial content
Populate the database with content scraped and adapted from visera.ca:
docker compose exec web python manage.py seed_content
To flush and re-seed from scratch:
docker compose exec web python manage.py seed_content --flush
Local Development (without Docker)
Prerequisites
- Python 3.12+
- PostgreSQL 14+
1. Set up virtual environment
python -m venv .venv
source .venv/bin/activate # Windows: .venv\Scripts\activate
pip install -r requirements-dev.txt
2. Configure environment
cp .env.example .env
Edit .env:
DJANGO_SECRET_KEY=your-key
POSTGRES_DB=tecvico
POSTGRES_USER=your_pg_user
POSTGRES_PASSWORD=your_pg_password
POSTGRES_HOST=localhost
POSTGRES_PORT=5432
3. Create the database
createdb tecvico
4. Run migrations & seed
python manage.py migrate
python manage.py seed_content
python manage.py createsuperuser
5. Start development server
python manage.py runserver
Running Tests
With Django test runner
python manage.py test apps
With pytest (requires requirements-dev.txt)
pytest
With coverage report
coverage run -m pytest
coverage report -m
coverage html # Generates htmlcov/index.html
Production Deployment
1. Build and start production containers
Remove docker-compose.override.yml (or don't override it) and pass production environment variables:
DJANGO_SETTINGS_MODULE=config.settings.production \
docker compose -f docker-compose.yml up --build -d
2. Production .env checklist
| Variable | Notes |
|---|---|
DJANGO_SECRET_KEY |
Use python -c "import secrets; print(secrets.token_urlsafe(50))" |
DEBUG |
Must be False |
ALLOWED_HOSTS |
Comma-separated: yourdomain.com,www.yourdomain.com |
CSRF_TRUSTED_ORIGINS |
https://yourdomain.com |
POSTGRES_PASSWORD |
Strong random password |
SECURE_SSL_REDIRECT |
True when behind TLS termination |
3. Reverse proxy (recommended)
Place an Nginx or Caddy reverse proxy in front of Gunicorn for TLS termination and serving static files (or let WhiteNoise handle statics directly).
Admin Panel
Access Django Admin at /admin/ with superuser credentials.
What you can manage
| Model | Description |
|---|---|
| Main Products | Top-level products with nested sub-products inline |
| Sub Products | Modules within a main product; articles editable inline |
| Articles | Article entries with section key/values inline |
| Article Sections | Individual key-value metadata rows |
| FAQ Entries | Accordion FAQ items (order, active toggle) |
| Download Items | Platform download links (Windows/macOS/Linux) |
Seed Content
The seed_content command populates:
- ViSERA (MainProduct) with 5 sub-products:
- Image Processing
- Radiomics Features
- Medical Image Visualization
- Format Conversion
- Workflow Management
- Articles and sections for each sub-product
- 6 FAQ entries
- 3 download items (Windows active, macOS/Linux coming soon)
Content is adapted from the original visera.ca website.
Design System
The website uses a custom dark-glass design combining:
- visera.ca aesthetic — dark background, organic blob animations, blue/teal accents
- Apple visionOS Ice aesthetic — frosted glass panels (
backdrop-filter: blur), translucent cards, soft gradients
Key CSS custom properties are in static/css/main.css under :root.
License
Content is adapted from visera.ca under CC BY-NC-SA. Software code is proprietary to Tecvico Corp.