CodeProfileCard

The ruixen.com frontend (built with Next.js) can be paired with a dedicated FastAPI backend for better scalability, maintainability, and security. The backend should live in a separate folder (or repository) named ruixen-backend, containing API routes, database models, and authentication logic. Both frontend and backend can communicate securely via environment variables and HTTPS APIs, keeping sensitive data like API keys, DB credentials, and JWT secrets in .env files. This separation ensures cleaner version control, easier CI/CD deployment, and improved security through isolated environments for frontend and backend.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds CodeProfileCard to your project and fits it to your theme.

import React from "react";
import { CodeProfileCard } from "@/components/ui/code-profile-card";

export default function CodeProfileDemoPage() {
  return (
    <div className="flex items-center justify-center min-h-screen bg-background p-4">
      <CodeProfileCard />
    </div>
  );
}