Full-stack web file manager for Linux NAS with DDD architecture, Spring Boot 3 backend, Vue 3 mobile-first frontend, and Docker deployment.
A comprehensive web-based file manager for Linux NAS with multi-user support, permission control, and mobile-first design. Built with Domain-Driven Design (DDD) principles, Spring Boot 3 backend, and Vue 3 + Vant UI frontend.
**Type:** Web File Manager
**Target:** Linux NAS
**Architecture:** Domain-Driven Design (DDD)
**Deployment:** Docker
Follow strict DDD layering with clear boundaries:
```
backend/
├── domain/ # Core business logic
│ ├── event/ # Domain events
│ ├── model/ # Domain models
│ ├── repository/ # Repository interfaces
│ ├── service/ # Domain services
│ └── utils/ # Domain utilities
├── application/ # Application orchestration
│ ├── assembler/ # Application-level assemblers
│ ├── config/ # Application configuration
│ ├── dto/ # Application DTOs
│ ├── event/ # Application event handlers
│ ├── scheduler/ # Scheduled tasks
│ └── service/ # Application services
├── infrastructure/ # Technical capabilities
│ ├── config/ # Infrastructure config
│ ├── external/ # External service integrations
│ ├── persistence/ # Data persistence
│ │ ├── converter/ # Data converters
│ │ ├── entity/ # JPA entities
│ │ ├── mapper/ # MyBatis mappers
│ │ ├── po/ # Persistent objects
│ │ └── repository/ # Repository implementations
│ ├── security/ # Security implementations
│ ├── util/ # Infrastructure utilities
│ └── task/ # Background task handlers
└── interfaces/ # External interfaces
└── src/main/
├── java/com.huanzhen.fileflexmanager.interfaces/
│ ├── api/
│ │ ├── advice/ # Global exception handlers
│ │ ├── assembler/ # API assemblers
│ │ └── controller/ # REST controllers
│ ├── config/ # Interface configuration
│ ├── convert/ # Converters
│ ├── exception/ # Custom exceptions
│ ├── facade/ # API facades
│ └── model/
│ ├── dto/ # Data transfer objects
│ ├── req/ # Request models
│ ├── resp/ # Response models
│ └── vo/ # View objects
└── resources/
├── data/ # Static data
├── db.migration/ # Database migrations
├── static/ # Static assets
└── application*.yml # Configuration files
```
```
frontend/
├── src/
│ ├── api/ # API client layer
│ ├── assets/ # Static assets
│ ├── components/ # Reusable components
│ ├── router/ # Vue Router configuration
│ ├── stores/ # Pinia state management
│ ├── utils/ # Utility functions
│ └── views/ # Page components
├── public/ # Public static files
├── dist/ # Build output
└── config/ # Build and environment config
├── env/
├── typescript/
└── build/
```
**Layer Flow:** `interfaces → application → domain ← infrastructure`
**Strict Boundaries:**
**When writing domain code:**
1. Define domain models with rich behavior (not anemic models)
2. Use value objects for domain concepts
3. Emit domain events for important state changes
4. Keep domain services focused on business logic only
**Type-Safe Mapping:**
**Mapping Layers:**
**MapStruct Best Practices:**
1. Create mapper interfaces with `@Mapper(componentModel = "spring")`
2. Use `@Mapping` annotations for custom field mapping
3. Define custom methods for complex transformations
4. Inject mappers via Spring dependency injection
**Three-Layer Data Model:**
**Response Structure:**
**Component Architecture:**
**API Integration:**
**Import Path Standards:**
**Exception Handling:**
**Domain Events:**
**Repository Pattern:**
**Unit Tests (JUnit 5):**
**Coverage Requirements:**
**Integration Tests:**
**Test Structure Example:**
```java
@Test
void shouldUploadFileSuccessfully() {
// Given
// When
// Then
}
@Test
void shouldThrowExceptionWhenFileExceedsLimit() {
// Given
// When
// Then
}
```
1. **Domain Layer First:**
- Define domain model with business rules
- Create domain service if needed
- Define repository interface
- Emit domain events for state changes
2. **Application Layer:**
- Create application service to orchestrate domain operations
- Define application DTOs
- Create assembler to map DTOs to domain models
3. **Infrastructure Layer:**
- Implement repository with MyBatis Plus
- Create PO (persistent object) for database
- Add MapStruct mapper for Domain ↔ PO conversion
4. **Interfaces Layer:**
- Create REST controller
- Define request/response models
- Add MapStruct mapper for DTO ↔ Domain conversion
- Implement validation rules
5. **Frontend:**
- Create API client function in `src/api/`
- Build Vue component with TypeScript
- Use Vant UI components
- Handle loading and error states
6. **Testing:**
- Write unit tests for domain logic
- Add integration tests for API endpoints
- Test mobile UI responsiveness
**Docker Environment:**
**Deployment Checklist:**
1. Run Gradle build: `./gradlew clean build`
2. Run frontend build: `npm run build`
3. Build Docker image
4. Configure volume mounts for file storage
5. Set environment variables
6. Deploy to target Linux NAS
**1. Domain Model (`domain/model/`):**
```java
public class FileUpload {
private FileId id;
private FileName name;
private FileSize size;
private UserId uploadedBy;
public void validate() {
// Business rules
}
}
```
**2. Application Service (`application/service/`):**
```java
@Service
public class FileUploadService {
public FileUploadResult upload(FileUploadCommand command) {
// Orchestrate domain operations
}
}
```
**3. REST Controller (`interfaces/api/controller/`):**
```java
@RestController
@RequestMapping("/api/files")
public class FileController {
@PostMapping("/upload")
public BaseResponse<FileUploadResp> upload(@Valid FileUploadReq req) {
// Handle request
}
}
```
**4. Frontend API (`frontend/src/api/file.ts`):**
```typescript
export const uploadFile = (file: File) => {
return request<BaseResponse<FileUploadResp>>({
url: '/api/files/upload',
method: 'POST',
data: file
})
}
```
Leave a review
No reviews yet. Be the first to review this skill!
# Download SKILL.md from killerskills.ai/api/skills/fileflexmanager-development/raw