Build Password-Protected Report Website with PDF Export and Docker Packaging
Budget: $30 – $250 USD
**Project Overview:**
Develop a password-protected website that allows users to view and interact with business reports. The website will:
- Authenticate users using a fixed username and password.
- Retrieve and display a paginated list of business reports from a provided API endpoint.
- Open selected reports in a new tab, displaying detailed information with introductory slides, tables, and charts.
- Allow users to download reports as PDFs.
- Be developed using any frontend technology.
- Include fully documented source code.
- Be packaged in a Docker container with a Dockerfile and setup instructions.
---
**Detailed Requirements:**
1. **Authentication:**
- Create a **login page** with a fixed username and password (credentials will be provided upon hiring).
- Ensure the login page is secure to prevent unauthorized access.
2. **Report Listing:**
- After successful login, query a provided API endpoint (returns JSON data) to retrieve a **paginated list of business reports**.
- Display the list with informative columns (e.g., report name, date, summary).
3. **Report Details:**
- When a user selects a report, open it in a **new browser tab**.
- In the new tab:
- **Design/Layout:**
- Follow the provided design references as closely as possible (logos, colors, layouts). Design assets will be provided in PDF and PPT formats.
- Include introductory slides or sections as specified.
- **Data Display:**
- Query another API endpoint (returns JSON data) to retrieve detailed information for the selected report.
- Display the information in structured **sections**, including **tables** and **charts**.
- **Download Option:**
- Include a **"Download PDF"** button.
- Upon clicking, render the current report view into a PDF and automatically download it to the user's device.
4. **Technical Requirements:**
- **Frontend Technology:** You may use any frontend framework or library (e.g., React, Angular, Vue.js).
- **Documentation:** Provide fully documented source code for ease of maintenance and future development.
- **Dockerization:**
- Package the entire application into a Docker container.
- Provide a **Dockerfile** and clear instructions on how to build and run the Docker image.
---
**Notes:**
- **API Endpoints:**
- Two endpoints will be provided:
- One for retrieving the list of reports.
- One for retrieving detailed information for a selected report.
- Both endpoints return data in JSON format and contain all the necessary information.
- **Design Assets:**
- A PDF and PPT will be provided to illustrate the desired design.
- The design is straightforward, featuring logos and solid colors.
- Reproduce the provided design as closely as possible.
- **Deliverables:**
- Complete and documented source code.
- Dockerfile and instructions for building and running the Docker container.
- Functional application matching the specified requirements and design.
---
**Summary:**
You will develop a secure, user-friendly website that interfaces with provided APIs to display business reports. The application should be visually consistent with provided design materials, offer PDF download functionality, and be delivered as a Dockerized application with complete documentation.
Develop a password-protected website that allows users to view and interact with business reports. The website will:
- Authenticate users using a fixed username and password.
- Retrieve and display a paginated list of business reports from a provided API endpoint.
- Open selected reports in a new tab, displaying detailed information with introductory slides, tables, and charts.
- Allow users to download reports as PDFs.
- Be developed using any frontend technology.
- Include fully documented source code.
- Be packaged in a Docker container with a Dockerfile and setup instructions.
---
**Detailed Requirements:**
1. **Authentication:**
- Create a **login page** with a fixed username and password (credentials will be provided upon hiring).
- Ensure the login page is secure to prevent unauthorized access.
2. **Report Listing:**
- After successful login, query a provided API endpoint (returns JSON data) to retrieve a **paginated list of business reports**.
- Display the list with informative columns (e.g., report name, date, summary).
3. **Report Details:**
- When a user selects a report, open it in a **new browser tab**.
- In the new tab:
- **Design/Layout:**
- Follow the provided design references as closely as possible (logos, colors, layouts). Design assets will be provided in PDF and PPT formats.
- Include introductory slides or sections as specified.
- **Data Display:**
- Query another API endpoint (returns JSON data) to retrieve detailed information for the selected report.
- Display the information in structured **sections**, including **tables** and **charts**.
- **Download Option:**
- Include a **"Download PDF"** button.
- Upon clicking, render the current report view into a PDF and automatically download it to the user's device.
4. **Technical Requirements:**
- **Frontend Technology:** You may use any frontend framework or library (e.g., React, Angular, Vue.js).
- **Documentation:** Provide fully documented source code for ease of maintenance and future development.
- **Dockerization:**
- Package the entire application into a Docker container.
- Provide a **Dockerfile** and clear instructions on how to build and run the Docker image.
---
**Notes:**
- **API Endpoints:**
- Two endpoints will be provided:
- One for retrieving the list of reports.
- One for retrieving detailed information for a selected report.
- Both endpoints return data in JSON format and contain all the necessary information.
- **Design Assets:**
- A PDF and PPT will be provided to illustrate the desired design.
- The design is straightforward, featuring logos and solid colors.
- Reproduce the provided design as closely as possible.
- **Deliverables:**
- Complete and documented source code.
- Dockerfile and instructions for building and running the Docker container.
- Functional application matching the specified requirements and design.
---
**Summary:**
You will develop a secure, user-friendly website that interfaces with provided APIs to display business reports. The application should be visually consistent with provided design materials, offer PDF download functionality, and be delivered as a Dockerized application with complete documentation.