Zum Inhalt springen

Blog Syndication Platform Plan

Of course. Based on the development plan, here is a detailed prompt you can use with an AI-powered IDE like Cursor to generate the initial codebase for your blog syndication application.

This prompt is designed to be comprehensive, providing the AI with the necessary context, technology stack, and feature requirements to build the Minimum Viable Product (MVP).

Prompt for Cursor IDE

„You are an expert full-stack software developer. Your task is to generate the initial codebase for a blog syndication application based on the following detailed plan.

Project Goal:
Create a web application that allows a user to write a blog post in a central dashboard and then publish it to their Medium account. This is the MVP for a larger system that will eventually support multiple platforms.

Technology Stack:

  • Backend: Node.js with Express.js
  • Frontend: React with Vite
  • UI Components: shadcn/ui
  • Database: PostgreSQL
  • Styling: Tailwind CSS

File Structure:
Please create a monorepo structure with two main packages:

  • /server: For the Node.js/Express.js backend.
  • /client: For the React frontend.

Backend (/server) Requirements:

  1. API Server Setup:

    • Set up a basic Express.js server.
    • Include cors middleware to allow requests from the frontend.
    • Use dotenv to manage environment variables.
  2. Database Schema (PostgreSQL):

    • Please define the database schema. You can use a simple SQL script or an ORM like Prisma.
    • posts table:
      • id (Primary Key, UUID)
      • title (TEXT, NOT NULL)
      • content_markdown (TEXT)
      • status (VARCHAR, e.g., ‚draft‘, ‚published‘)
      • created_at (TIMESTAMP)
      • updated_at (TIMESTAMP)
    • credentials table:
      • id (Primary Key, SERIAL)
      • platform_name (VARCHAR, e.g., ‚medium‘)
      • api_key (TEXT, should be encrypted)
      • user_id (placeholder for future multi-user support)
  3. API Endpoints:

    • POST /api/posts: Creates a new post in the posts table. Expects { title, content_markdown } in the request body.
    • GET /api/posts: Retrieves all posts.
    • PUT /api/credentials/medium: Saves or updates the user’s Medium API key in the credentials table.
    • POST /api/publish/medium:
      • Takes a { postId } in the body.
      • Retrieves the post content from the posts table.
      • Retrieves the Medium API key from the credentials table.
      • Makes a POST request to the Medium API (https://api.medium.com/v1/users/{{authorId}}/posts) to publish the article.
      • The request to Medium should include title, contentFormat: "markdown", content, and publishStatus: "public".
      • Update the post’s status in the database.

Frontend (/client) Requirements:

  1. Setup:

    • Initialize a React application using Vite.
    • Set up Tailwind CSS and initialize shadcn/ui.
  2. Components and Pages:

    • Dashboard Page (/):
      • This should be the main view.
      • Display a list of all posts fetched from GET /api/posts. Use the Table component from shadcn/ui.
      • Include a Button to navigate to the „New Post“ page.
      • Include a link/button to the „Settings“ page.
    • New Post / Editor Page (/editor):
      • An Input for the post title.
      • A Textarea for the Markdown content. Make it large and suitable for writing.
      • A Button to „Save Draft“ which calls POST /api/posts.
      • A Button to „Publish to Medium“ which first saves the post and then calls POST /api/publish/medium.
    • Settings Page (/settings):
      • An Input field for the user to enter their Medium Integration Token (API Key).
      • A Button to „Save“ which calls PUT /api/credentials/medium.

User Flow for the MVP:

  1. The user navigates to the Settings page and saves their Medium API key.
  2. The user navigates to the Dashboard and clicks „New Post“.
  3. On the Editor page, they write a title and content.
  4. They click „Publish to Medium“.
  5. The app communicates with the backend, which then uses the saved API key to post the content to Medium.
  6. The post list on the Dashboard should reflect the new post.

Please generate the complete file structure and boilerplate code for both the client and server based on these requirements.“

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert