Compare commits

...

2 Commits
main ... geni96

2 changed files with 91 additions and 20 deletions

55
API.md
View File

@ -111,6 +111,14 @@ Query parameters:
Response: list of creator cards including follow state and avatar URL.
### Public Profile
```http
GET /api/v1/profiles/{creatorId}
```
Used by public creator profiles. The response contains display name, slug, bio, avatar URL, average rating and subscriber count.
### Update Profile
```http
@ -144,6 +152,8 @@ GET /api/v1/prompts?sortBy=date&ascending=false&limit=50&search=cat
Used by Marketplace. Supports sorting, search and category filtering.
Response items include prompt title, description, creator id, creator name, creator avatar, example image, price, like/save counts and access state.
### Feed
```http
@ -177,6 +187,23 @@ Request:
Response: created prompt. The frontend redirects to `/post-detail?id={id}`.
### Own Prompts
```http
GET /api/v1/prompts/mine
```
Used by My Profile to show prompts created by the logged-in user.
### Update Prompt
```http
PUT /api/v1/prompts/{id}
Content-Type: application/json
```
Request body uses the same editable fields as prompt creation. Used by the edit prompt flow.
### Prompt Detail
```http
@ -193,6 +220,20 @@ Response includes:
- example output
- example image
- rating data
- like/save state and counts
Paid prompts return no detail content for users without access.
### Likes and Saves
```http
PUT /api/v1/prompts/{id}/likes
DELETE /api/v1/prompts/{id}/likes
PUT /api/v1/prompts/{id}/saves
DELETE /api/v1/prompts/{id}/saves
```
Used by Dashboard, prompt detail and profile tabs to store user interactions.
### Reviews
@ -240,8 +281,20 @@ Default categories are created automatically when the backend starts.
### Follow or Subscribe to Creator
```http
GET /api/v1/subscriptions/{creatorId}
PUT /api/v1/subscriptions/{creatorId}
DELETE /api/v1/subscriptions/{creatorId}
```
Used by Community to follow or unfollow creators.
Used by Community and public profiles to read follow state, follow creators or unfollow creators.
## Error Handling
Common response codes used by the frontend:
- `200 OK`: request succeeded
- `400 Bad Request`: validation error or invalid request data
- `401 Unauthorized`: user is not logged in and should be redirected to login
- `404 Not Found`: requested prompt, profile or subscription was not found
The frontend handles failed requests with visible error states or redirects to login for unauthorized users.

View File

@ -1,21 +1,21 @@
# OnlyPrompt - AI Prompt Marketplace
## Description
OnlyPrompt is a frontend web applications where people can publish and sell their high-quality AI prompts. User can browse, filter, rate and unlock premium features such as private chats with creators for exclusive AI tips.
OnlyPrompt is a web application where users can create, publish, discover and interact with AI prompts. Users can edit their profiles, follow creators, like and save prompts, write reviews and browse free or paid prompt cards in a marketplace.
This project is built with with HTML, CSS and Java Script.
This project is built with HTML, CSS and JavaScript.
## Special Features
- 📝 Create and publish new prompts
- 🔍 Live search and category filtering
- 💬 Premium chat simulation with creators
- 🔒 Unlock premium prompts (payment simulation)
- ⭐ Rating system
- ❤️ Save favorites (LocalStorage)
- 📱 Fully responsive design (mobile & desktop)
- 🌐 External API integration (e.g., RandomUser API for creator profiles)
- 💾 Client-side data persistence
- 🔄 Basic server communication (optional file-based backend)
- 📝 Create, edit and publish AI prompts
- 🔍 Browse prompts in a marketplace with category, search and price filters
- 📄 View prompt detail pages with examples, ratings and access states
- ❤️ Like and save prompts
- 👥 Follow and discover other creators
- 👤 Edit user profiles with display name, username, bio and profile picture
- 🌐 View own and public creator profiles
- 📱 Responsive layout for desktop and mobile
- 🔄 Server communication through a REST API
- 💾 Shared data persistence with backend and database
## Installment (for local use)
@ -33,13 +33,31 @@ DB_PASSWORD=onlyprompt
```
## Technologies, Libraries, Frameworks
- HTML5 (Structure)
- CSS3 + Bootstrap + PureCSS (Styling & responsive layout)
- Vanilla JavaScript (Application logic)
- JavaScript Libraries Axios, JQuery
- ASP.NET Core (Backend)
- Postgres (Backend Datastorage)
- Docker (Deployment)
- HTML5 for page structure
- CSS3 with Flexbox/Grid for layout and responsive design
- Bootstrap Icons for UI icons
- Vanilla JavaScript for DOM manipulation, events and API calls
- Fetch API for asynchronous server communication
- ASP.NET Core as helper backend
- PostgreSQL for shared data persistence
- Docker for local development and deployment
## Technical Decisions
The frontend is built with plain HTML, CSS and Vanilla JavaScript because the project focuses on understanding core frontend concepts without using a JavaScript framework. The backend is used as a helper service for authentication, shared data persistence and REST API communication. Docker is used so that the project can be started consistently on different machines.
## Use of AI Tools
AI tools were used as support during development, mainly for debugging, comparing implementation approaches and improving documentation wording. Generated suggestions were reviewed, adapted and tested by the team before being included in the project.
## Security Considerations
The project uses authentication with a JWT cookie so that protected pages and API endpoints require a logged-in user. User input is validated on the backend for important operations such as registration, profile updates and prompt creation.
Known limitations:
- Payment and premium access are simulated and are not connected to a real payment provider.
- User-generated content is displayed in the frontend, so XSS prevention is important. The project avoids intentionally executing user input as code, but further output sanitization would be needed for production.
- Authentication is implemented for local project use and would need additional hardening for production.
## Reflection
A main challenge was connecting static frontend pages with dynamic backend data while keeping the application usable and consistent. During development, the project evolved from demo pages into a connected application with real profiles, prompts, likes, saves and creator interactions. We learned how important clear API structures, consistent data models and regular browser testing are when multiple pages depend on the same shared data.
## Group members and their roles
| Name | Role |