DevFlow - Nuxt 3

Modern rewrite of DevFlow using Nuxt 3, Vue 3 Composition API, and PrimeVue.

Tech Stack

• Framework: Nuxt 3 with SSR
• UI Library: PrimeVue 4 with Aura theme
• State Management: Pinia
• Database: MongoDB with Mongoose
• Styling: SCSS with CSS variables

Quick Start

Docker (recommended)

Runs the app and MongoDB together, with hot reload (client HMR + Nitro server rebuild). No Node/npm needed on the host — only Docker:

./dev.sh          # start (builds on first run) and wait until ready
./dev.sh logs     # follow app logs
./dev.sh rebuild  # after package.json changes (renews node_modules volume)
./dev.sh down     # stop everything (MongoDB data is kept)
./dev.sh help     # all commands

• App: http://localhost:3001 — MongoDB: localhost:27017 (data persisted in the mongodb_data volume)
• Edit files on the host as usual; changes are picked up inside the container.
• A .env file is optional; MONGODB_URI is set by the compose file to point at the bundled MongoDB.
• On macOS/Windows, if file changes are not detected, uncomment CHOKIDAR_USEPOLLING=true in docker-compose.yml.

Local (without Docker)

# Install dependencies
npm install

# Start development server (needs a MongoDB running, see .env)
npm run dev

# Seed a repeatable local scenario (two orgs, projects, tasks, time entries)
npm run db:seed:grande

# Build for production
npm run build
npm run preview

Project Structure

nuxt3/
├── assets/css/          # Global styles and SCSS variables
├── components/          # Vue components (auto-imported)
├── composables/         # Vue composables (auto-imported)
├── layouts/             # Page layouts
├── pages/               # File-based routing
├── plugins/             # Nuxt plugins
├── server/              # Nitro server (API routes, plugins)
├── stores/              # Pinia stores
└── nuxt.config.ts       # Nuxt configuration

Important Configuration

Component Auto-Import

Components are auto-imported without folder prefixes:

// nuxt.config.ts
components: {
  dirs: [{ path: '~/components', pathPrefix: false }]
}

Use <OrganizationInfo> not <OrganizationsOrganizationInfo>.

Environment Variables

Create .env file (optional when using Docker — the compose file already sets MONGODB_URI):

MONGODB_URI=mongodb://localhost:27017/devflow
SECRET=your-secret-key
BASE_URL=http://localhost:3001
# Where runtime uploads are written (default: public/uploads, relative to cwd)
UPLOADS_DIR=/app/uploads

Uploads

• Files land in UPLOADS_DIR/images (plus images/thumbs) and UPLOADS_DIR/documents.
• They are served by the Nitro route /uploads/**, not by public/: in a production build .output/public is only a snapshot of the build, so runtime files there are not served. Point UPLOADS_DIR at a persistent volume (see the compose files).
• POST /api/uploads/images and /api/uploads/documents require auth, cap files at 32MB and only accept an allowlist of mimetypes (no SVG).
• To move base64 images already stored in the database into files: node scripts/migrate-base64-images.mjs (--dry-run by default, --apply to write).

Documentation

• Login local e Authentik OIDC - Configuracao, vinculacao de contas, sessoes e migracao
• Migration Progress - Detailed migration status and architectural decisions

Development Notes

• Uses Vue 3 Composition API with <script setup>
• PrimeVue components replace Bootstrap-Vue
• Pinia stores replace Vuex
• TypeScript enabled with strict mode