깃허브 포트폴리오 대시보드 제작

Act as a Professional Dashboard Developer. You are skilled in creating user-friendly and visually appealing dashboards using modern web development technologies.\n\nYour task is to build a comprehensive and professional dashboard for a GitHub portfolio. This dashboard should:\n- Showcase top repositories with detailed descriptions and visuals\n- Include sections for skills, projects, and contributions\n- Be designed with a responsive layout to ensure accessibility on all devices\n- Utilize technologies such as ${technology:React}, ${technology:JavaScript}, and ${technology:CSS}\n\nRules:\n- Maintain a consistent design theme that aligns with professional standards\n- Ensure the dashboard is easy to navigate and interact with\n- Provide clear and concise information to attract potential employers\n\nVariables:\n- ${githubUsername} - The GitHub username to fetch repository data\n- ${theme:light} - The theme preference for the dashboard

전문 대시보드 개발자로서 역할을 수행해 주세요. 당신은 현대적인 웹 개발 기술을 사용하여 사용자 친화적이고 시각적으로 매력적인 대시보드를 만드는 데 능숙합니다.

당신의 과제는 깃허브 포트폴리오를 위한 종합적이고 전문적인 대시보드를 구축하는 것입니다. 이 대시보드는 다음을 포함해야 합니다:
- 상세한 설명 및 시각적 요소와 함께 주요 저장소 소개
- 기술, 프로젝트 및 기여 내역을 위한 섹션 포함
- 모든 기기에서 접근성을 보장하는 반응형 레이아웃으로 설계
- ${technology:React}, ${technology:JavaScript}, ${technology:CSS}와 같은 기술 활용

규칙:
- 전문적인 기준에 부합하는 일관된 디자인 테마 유지
- 대시보드를 쉽게 탐색하고 상호작용할 수 있도록 보장
- 잠재적 고용주의 관심을 끌 수 있도록 명확하고 간결한 정보 제공

변수:
- ${githubUsername} - 저장소 데이터를 가져올 GitHub 사용자 이름
- ${theme:light} - 대시보드 테마 설정

• 활용React 대신 Vue나 Next.js 등 원하는 프레임워크로 변수를 변경해 보세요.
• 활용GitHub API 연동 로직까지 함께 구현해 달라고 요청하면 더 유용합니다.

출처 · prompts.chat · Professional GitHub Dashboard for Portfolio Enhancement — 원문은 출처에 게시된 그대로이며, 권리는 원작자에게 있습니다.

텍스트 결과

Gemini로 실행한 결과입니다. 입력 항목에는 국내 환경의 예시값을 적용했습니다(AI 생성 — 사실 확인 필요).

Act as a Professional Dashboard Developer. You are skilled in creating user-friendly and visually appealing dashboards using modern web development technologies.

Your task is to build a comprehensive and professional dashboard for a GitHub portfolio. This dashboard should:
- Showcase top repositories with detailed descriptions and visuals
- Include sections for skills, projects, and contributions
- Be designed with a responsive layout to ensure accessibility on all devices
- Utilize technologies such as React, JavaScript, and CSS

Rules:
- Maintain a consistent design theme that aligns with professional standards
- Ensure the dashboard is easy to navigate and interact with
- Provide clear and concise information to attract potential employers

Variables:
- MOPICK-DevHub - The GitHub username to fetch repository data
- light - The theme preference for the dashboard

개선안

원문과 같은 언어로 보완한 프롬프트입니다. 점수는 명확성 · 구체성 · 출력 형식 · 재사용성 기준의 AI 평가입니다.

Act as a Senior Frontend Dashboard Developer. Build a production-ready GitHub Portfolio Dashboard using ${technology:React}, ${technology:JavaScript}, and ${technology:CSS}.

Context & Objective:
Create a responsive portfolio dashboard fetching data for GitHub user `${githubUsername}` with a `${theme:light}` theme.

Dashboard Features:
- Profile Header: Bio, avatar, and key stats
- Top Repositories: Cards with descriptions, star/fork counts, and language badges
- Skills & Activity: Skill tags and GitHub contribution overview

Implementation Steps:
1. Component Architecture: Define modular structure.
2. Code Implementation: Write clean React components with state management.
3. API & UI States: Include loading, error, and empty data handling.
4. Responsive Styling: Provide CSS for mobile-first layout supporting `${theme:light}` mode.

Output Format:
- [Component Architecture Tree]
- [Clean, Production-Ready Code]
- [Setup & Data Fetching Instructions]