Ireneusz Bachanowicz
c5202ca4c5
- Updated .cursorrules with clearer project organization - Removed setup-project.sh script and consolidated project documentation - Simplified and restructured project rules, overview, and resources - Added comprehensive task list with detailed development roadmap - Cleaned up and standardized markdown files in .cursor/rules directory
193 lines
11 KiB
Markdown
193 lines
11 KiB
Markdown
---
|
|
description: Decomposed task list for the CV Optimization Platform, organized by component and functionality. Follow this plan from top to bottom.
|
|
globs:
|
|
---
|
|
# Decomposed Development Task List
|
|
|
|
**Project Goal:** Develop a CV Optimization Platform MVP with core features: CV upload, AI-powered analysis, and basic suggestion display.
|
|
|
|
**Development Flow:** Follow the components and tasks in the order listed below for a logical development progression.
|
|
|
|
---
|
|
|
|
## 1. Frontend Development (React.js with Next.js)
|
|
|
|
**Functionality:** User Interface and User Interaction
|
|
|
|
### 1.1. UI Structure and Basic Layout
|
|
- **Tasks:**
|
|
- [ ] 1.1.1. Set up basic Next.js project structure (if not already done).
|
|
- [ ] 1.1.2. Create homepage (`pages/index.js`) with a clear heading and project description.
|
|
- [ ] 1.1.3. Design basic layout using Tailwind CSS for overall page structure (header, main content area).
|
|
- [ ] 1.1.4. Create a placeholder area for CV upload section.
|
|
- [ ] 1.1.5. Create a placeholder area for displaying original CV text.
|
|
- [ ] 1.1.6. Create a placeholder area for displaying improved CV text/suggestions.
|
|
|
|
### 1.2. File Upload Functionality
|
|
- **Tasks:**
|
|
- [ ] 1.2.1. Install `react-dropzone` library.
|
|
- [ ] 1.2.2. Create a File Upload Component (`components/FileUpload.js`).
|
|
- [ ] 1.2.3. Implement drag-and-drop functionality using `react-dropzone`.
|
|
- [ ] 1.2.4. Implement file selection button.
|
|
- [ ] 1.2.5. Display selected file name to the user.
|
|
- [ ] 1.2.6. Implement basic client-side file type validation (.pdf, .doc, .docx, .txt).
|
|
- [ ] 1.2.7. Implement basic client-side file size validation.
|
|
- [ ] 1.2.8. Display user-friendly error messages for file validation failures.
|
|
|
|
### 1.3. Displaying Original CV Text
|
|
- **Tasks:**
|
|
- [ ] 1.3.1. Create a component to display CV text (`components/CVDisplay.js`).
|
|
- [ ] 1.3.2. Fetch uploaded file content from backend API (after backend `/upload` endpoint is ready - *note dependency*).
|
|
- [ ] 1.3.3. Display the raw text content of the uploaded CV in the `CVDisplay` component.
|
|
- [ ] 1.3.4. Implement basic formatting for text display (preserve line breaks, basic text styling).
|
|
|
|
### 1.4. Displaying Improved CV Text/Suggestions (Placeholder for now)
|
|
- **Tasks:**
|
|
- [ ] 1.4.1. Create a placeholder component for improved CV display (`components/ImprovedCVDisplay.js`).
|
|
- [ ] 1.4.2. For now, display static placeholder text in `ImprovedCVDisplay` (e.g., "Improved CV Suggestions will appear here").
|
|
- [ ] 1.4.3. Plan layout for side-by-side comparison or tabbed view for original vs. improved CV (implementation later).
|
|
|
|
### 1.5. Basic Frontend Styling and Responsiveness
|
|
- **Tasks:**
|
|
- [ ] 1.5.1. Apply Tailwind CSS styling to all frontend components for a consistent look and feel.
|
|
- [ ] 1.5.2. Ensure basic responsiveness for different screen sizes (desktop, mobile).
|
|
- [ ] 1.5.3. Refine UI elements for better user experience (padding, margins, font sizes, colors).
|
|
|
|
---
|
|
|
|
## 2. Backend Development (Node.js/Express.js OR Python/Flask/FastAPI - *Choose one and proceed*)
|
|
|
|
**Functionality:** API Endpoints, Logic, LLM Integration, Document Processing
|
|
|
|
### 2.1. Backend Project Setup and API Framework
|
|
- **Tasks (Choose Node.js OR Python path):**
|
|
|
|
**Node.js/Express.js Path:**
|
|
- [ ] 2.1.1. Set up Node.js backend project (using `npm init`).
|
|
- [ ] 2.1.2. Install Express.js and required packages (`express`, `dotenv`, etc.).
|
|
- [ ] 2.1.3. Create a basic Express.js server (`server.js`) with a "Hello World" endpoint to test.
|
|
- [ ] 2.1.4. Configure `.env` file for environment variables.
|
|
|
|
**Python/Flask/FastAPI Path:**
|
|
- [ ] 2.1.1. Set up Python backend project and virtual environment.
|
|
- [ ] 2.1.2. Install Flask/FastAPI and required packages (`flask` or `fastapi`, `uvicorn`, `python-dotenv`, etc.).
|
|
- [ ] 2.1.3. Create a basic Flask/FastAPI app (`app.py`) with a "Hello World" endpoint to test.
|
|
- [ ] 2.1.4. Configure `.env` file for environment variables.
|
|
|
|
### 2.2. `/upload` API Endpoint - File Handling
|
|
- **Tasks (Adjust based on Node.js or Python):**
|
|
- [ ] 2.2.1. Create `/upload` API endpoint in backend.
|
|
- [ ] 2.2.2. Implement file upload handling using appropriate middleware/libraries (e.g., `multer` in Node.js, Flask/FastAPI file handling).
|
|
- [ ] 2.2.3. Implement server-side file type validation (double-check file types).
|
|
- [ ] 2.2.4. Implement server-side file size limits.
|
|
- [ ] 2.2.5. Save uploaded files temporarily to a server directory (for processing).
|
|
- [ ] 2.2.6. Return success response to frontend with temporary file path or identifier.
|
|
- [ ] 2.2.7. Implement error handling for file upload failures and return appropriate error responses.
|
|
|
|
### 2.3. Document Text Extraction Functionality
|
|
- **Tasks (Adjust based on Node.js or Python and chosen libraries):**
|
|
- [ ] 2.3.1. Install document processing libraries (e.g., `pdf-parse`, `docx-parser` for Node.js OR `PyPDF2`, `python-docx` for Python).
|
|
- [ ] 2.3.2. Create functions to extract text from:
|
|
- [ ] 2.3.2.a. PDF files
|
|
- [ ] 2.3.2.b. DOCX files
|
|
- [ ] 2.3.2.c. DOC files (if supporting)
|
|
- [ ] 2.3.2.d. TXT files
|
|
- [ ] 2.3.3. Integrate text extraction functions into `/upload` endpoint after file saving.
|
|
- [ ] 2.3.4. After successful text extraction, return the extracted text in the API response to the frontend (instead of just file path).
|
|
- [ ] 2.3.5. Implement error handling for text extraction failures.
|
|
|
|
### 2.4. `/analyze` API Endpoint - LLM Integration (Initial Setup)
|
|
- **Tasks (Adjust based on Node.js or Python and OpenAI API):**
|
|
- [ ] 2.4.1. Create `/analyze` API endpoint in backend.
|
|
- [ ] 2.4.2. Install OpenAI API library (or chosen LLM library).
|
|
- [ ] 2.4.3. Configure OpenAI API key in `.env` file and load it securely.
|
|
- [ ] 2.4.4. In `/analyze` endpoint, receive CV text from frontend request.
|
|
- [ ] 2.4.5. Construct a basic prompt for the LLM for general CV improvement (use prompt examples from previous discussions).
|
|
- [ ] 2.4.6. Send the CV text and prompt to the OpenAI API.
|
|
- [ ] 2.4.7. Receive the LLM response.
|
|
- [ ] 2.4.8. For now, simply return the raw LLM response text to the frontend in the API response.
|
|
- [ ] 2.4.9. Implement basic error handling for OpenAI API calls (API connection errors, rate limits, etc.).
|
|
|
|
---
|
|
|
|
## 3. Integration and Testing
|
|
|
|
**Functionality:** Connecting Frontend and Backend, End-to-End Testing
|
|
|
|
### 3.1. Connect Frontend File Upload to Backend `/upload` Endpoint
|
|
- **Tasks:**
|
|
- [ ] 3.1.1. In Frontend `FileUpload` component, modify file upload logic to send files to the backend `/upload` endpoint using `fetch` or `axios`.
|
|
- [ ] 3.1.2. Handle successful `/upload` response and store the returned CV text (or file identifier if needed) in frontend state.
|
|
- [ ] 3.1.3. Display the received CV text in the `CVDisplay` component.
|
|
- [ ] 3.1.4. Handle error responses from `/upload` endpoint and display user-friendly error messages.
|
|
|
|
### 3.2. Connect Frontend "Process CV" Button to Backend `/analyze` Endpoint
|
|
- **Tasks:**
|
|
- [ ] 3.2.1. Add a "Process CV" button to the frontend UI (below the uploaded CV display area).
|
|
- [ ] 3.2.2. When "Process CV" button is clicked, trigger an API call from frontend to backend `/analyze` endpoint.
|
|
- [ ] 3.2.3. Send the CV text (currently displayed in `CVDisplay`) to the `/analyze` endpoint in the request body.
|
|
- [ ] 3.2.4. Handle successful `/analyze` response and store the returned improved CV text (LLM response) in frontend state.
|
|
- [ ] 3.2.5. Display the received improved CV text in the `ImprovedCVDisplay` component (replace placeholder text).
|
|
- [ ] 3.2.6. Handle error responses from `/analyze` endpoint and display user-friendly error messages.
|
|
- [ ] 3.2.7. Implement loading state/spinner to indicate processing while waiting for API responses.
|
|
|
|
### 3.3. End-to-End Testing and Refinement
|
|
- **Tasks:**
|
|
- [ ] 3.3.1. Test the entire flow: Upload CV -> Display Original -> Click "Process CV" -> Display Improved CV.
|
|
- [ ] 3.3.2. Test with different file types (.pdf, .docx, .txt).
|
|
- [ ] 3.3.3. Test with various CV content examples.
|
|
- [ ] 3.3.4. Test error handling scenarios (invalid file types, large files, API errors, etc.).
|
|
- [ ] 3.3.5. Refine UI and user flow based on testing.
|
|
- [ ] 3.3.6. Basic code cleanup and commenting.
|
|
|
|
---
|
|
|
|
## 4. Deployment (Initial MVP Deployment)
|
|
|
|
**Functionality:** Deploying Frontend and Backend to hosting platforms.
|
|
|
|
### 4.1. Frontend Deployment to Vercel
|
|
- **Tasks:**
|
|
- [ ] 4.1.1. Create a Vercel account (if not already done).
|
|
- [ ] 4.1.2. Connect your frontend GitHub repository to Vercel.
|
|
- [ ] 4.1.3. Configure Vercel deployment settings (if needed, usually auto-detects Next.js).
|
|
- [ ] 4.1.4. Deploy frontend to Vercel.
|
|
- [ ] 4.1.5. Verify frontend is accessible on Vercel URL.
|
|
|
|
### 4.2. Backend Deployment to Render/Heroku (Choose one)
|
|
- **Tasks (Choose Render or Heroku):**
|
|
|
|
**Render Deployment:**
|
|
- [ ] 4.2.1. Create a Render account (if not already done).
|
|
- [ ] 4.2.2. Create a new Web Service on Render.
|
|
- [ ] 4.2.3. Connect your backend GitHub repository to Render.
|
|
- [ ] 4.2.4. Configure Render deployment settings (build command, start command, environment variables - especially OpenAI API key).
|
|
- [ ] 4.2.5. Deploy backend to Render.
|
|
- [ ] 4.2.6. Verify backend API is accessible on Render URL (e.g., test "Hello World" endpoint).
|
|
|
|
**Heroku Deployment:**
|
|
- [ ] 4.2.1. Create a Heroku account (if not already done).
|
|
- [ ] 4.2.2. Create a new Heroku app.
|
|
- [ ] 4.2.3. Connect your backend GitHub repository to Heroku.
|
|
- [ ] 4.2.4. Configure Heroku deployment settings (buildpacks, environment variables - especially OpenAI API key).
|
|
- [ ] 4.2.5. Deploy backend to Heroku.
|
|
- [ ] 4.2.6. Verify backend API is accessible on Heroku URL (e.g., test "Hello World" endpoint).
|
|
|
|
### 4.3. Configure Frontend to Connect to Deployed Backend
|
|
- **Tasks:**
|
|
- [ ] 4.3.1. In Frontend code, update API endpoint URLs to point to your deployed backend URL (on Render/Heroku).
|
|
- [ ] 4.3.2. Re-deploy frontend to Vercel with updated backend URL.
|
|
- [ ] 4.3.3. Test the entire application flow on the deployed environment (Vercel frontend connected to Render/Heroku backend).
|
|
|
|
---
|
|
|
|
**Next Steps (Post MVP - Not part of this decomposed list yet, for future planning):**
|
|
|
|
- Implement User Accounts
|
|
- Enhance LLM Prompting and Analysis (ATS Optimization, Job Description Tailoring)
|
|
- Implement Suggestion Editing and User Feedback
|
|
- Advanced UI/UX improvements
|
|
- Monetization Strategy Implementation
|
|
- ... and so on
|
|
|
|
**Follow this decomposed task list sequentially. Start with "1. Frontend Development - 1.1. UI Structure and Basic Layout" and work your way down. This provides a clear path to build your MVP.** |