awslabs.frontend-mcp-server 0.0.1__py3-none-any.whl
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- awslabs/__init__.py +13 -0
- awslabs/frontend_mcp_server/__init__.py +14 -0
- awslabs/frontend_mcp_server/server.py +90 -0
- awslabs/frontend_mcp_server/static/react/essential-knowledge.md +251 -0
- awslabs/frontend_mcp_server/static/react/troubleshooting.md +14 -0
- awslabs/frontend_mcp_server/utils/__init__.py +1 -0
- awslabs/frontend_mcp_server/utils/file_utils.py +24 -0
- awslabs_frontend_mcp_server-0.0.1.dist-info/METADATA +91 -0
- awslabs_frontend_mcp_server-0.0.1.dist-info/RECORD +13 -0
- awslabs_frontend_mcp_server-0.0.1.dist-info/WHEEL +4 -0
- awslabs_frontend_mcp_server-0.0.1.dist-info/entry_points.txt +2 -0
- awslabs_frontend_mcp_server-0.0.1.dist-info/licenses/LICENSE +175 -0
- awslabs_frontend_mcp_server-0.0.1.dist-info/licenses/NOTICE +2 -0
awslabs/__init__.py
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
# Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
#
|
|
3
|
+
# Licensed under the Apache License, Version 2.0 (the "License"). You may not use this file except in compliance
|
|
4
|
+
# with the License. A copy of the License is located at
|
|
5
|
+
#
|
|
6
|
+
# http://www.apache.org/licenses/LICENSE-2.0
|
|
7
|
+
#
|
|
8
|
+
# or in the 'license' file accompanying this file. This file is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES
|
|
9
|
+
# OR CONDITIONS OF ANY KIND, express or implied. See the License for the specific language governing permissions
|
|
10
|
+
# and limitations under the License.
|
|
11
|
+
|
|
12
|
+
# This file is part of the awslabs namespace.
|
|
13
|
+
# It is intentionally minimal to support PEP 420 namespace packages.
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
# Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
#
|
|
3
|
+
# Licensed under the Apache License, Version 2.0 (the "License"). You may not use this file except in compliance
|
|
4
|
+
# with the License. A copy of the License is located at
|
|
5
|
+
#
|
|
6
|
+
# http://www.apache.org/licenses/LICENSE-2.0
|
|
7
|
+
#
|
|
8
|
+
# or in the 'license' file accompanying this file. This file is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES
|
|
9
|
+
# OR CONDITIONS OF ANY KIND, express or implied. See the License for the specific language governing permissions
|
|
10
|
+
# and limitations under the License.
|
|
11
|
+
|
|
12
|
+
"""awslabs.frontend-mcp-server"""
|
|
13
|
+
|
|
14
|
+
__version__ = '0.0.0'
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
# Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
#
|
|
3
|
+
# Licensed under the Apache License, Version 2.0 (the "License"). You may not use this file except in compliance
|
|
4
|
+
# with the License. A copy of the License is located at
|
|
5
|
+
#
|
|
6
|
+
# http://www.apache.org/licenses/LICENSE-2.0
|
|
7
|
+
#
|
|
8
|
+
# or in the 'license' file accompanying this file. This file is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES
|
|
9
|
+
# OR CONDITIONS OF ANY KIND, express or implied. See the License for the specific language governing permissions
|
|
10
|
+
# and limitations under the License.
|
|
11
|
+
|
|
12
|
+
"""awslabs frontend MCP Server implementation."""
|
|
13
|
+
|
|
14
|
+
import argparse
|
|
15
|
+
from awslabs.frontend_mcp_server.utils.file_utils import load_markdown_file
|
|
16
|
+
from loguru import logger
|
|
17
|
+
from mcp.server.fastmcp import FastMCP
|
|
18
|
+
from pydantic import Field
|
|
19
|
+
from typing import Literal
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
mcp = FastMCP(
|
|
23
|
+
'awslabs.frontend-mcp-server',
|
|
24
|
+
instructions='The Frontend MCP Server provides specialized tools for modern web application development. It offers guidance on React application setup, optimistic UI implementation, and authentication integration. Use these tools when you need expert advice on frontend development best practices.',
|
|
25
|
+
dependencies=[
|
|
26
|
+
'pydantic',
|
|
27
|
+
'loguru',
|
|
28
|
+
],
|
|
29
|
+
)
|
|
30
|
+
|
|
31
|
+
|
|
32
|
+
@mcp.tool(name='GetReactDocsByTopic')
|
|
33
|
+
async def get_react_docs_by_topic(
|
|
34
|
+
topic: Literal[
|
|
35
|
+
'essential-knowledge',
|
|
36
|
+
'troubleshooting',
|
|
37
|
+
] = Field(
|
|
38
|
+
...,
|
|
39
|
+
description='The topic of React documentation to retrieve. Topics include: essential-knowledge, troubleshooting, basic-ui, authentication, routing, customizing, creating-components.',
|
|
40
|
+
),
|
|
41
|
+
) -> str:
|
|
42
|
+
"""Get specific AWS web application UI setup documentation by topic.
|
|
43
|
+
|
|
44
|
+
Parameters:
|
|
45
|
+
topic: The topic of React documentation to retrieve.
|
|
46
|
+
- "essential-knowledge": Essential knowledge for working with React applications.
|
|
47
|
+
- "troubleshooting": Common issues and solutions when generating code.
|
|
48
|
+
|
|
49
|
+
Returns:
|
|
50
|
+
A markdown string containing the requested documentation
|
|
51
|
+
"""
|
|
52
|
+
match topic:
|
|
53
|
+
case 'essential-knowledge':
|
|
54
|
+
return load_markdown_file('essential-knowledge.md')
|
|
55
|
+
case 'troubleshooting':
|
|
56
|
+
return load_markdown_file('troubleshooting.md')
|
|
57
|
+
case _:
|
|
58
|
+
raise ValueError(
|
|
59
|
+
f'Invalid topic: {topic}. Must be one of: essential-knowledge, basic-ui, authentication, routing, customizing, creating-components'
|
|
60
|
+
)
|
|
61
|
+
|
|
62
|
+
|
|
63
|
+
def main():
|
|
64
|
+
"""Run the MCP server with CLI argument support."""
|
|
65
|
+
parser = argparse.ArgumentParser(
|
|
66
|
+
description='An AWS Labs Model Context Protocol (MCP) server for frontend'
|
|
67
|
+
)
|
|
68
|
+
parser.add_argument('--sse', action='store_true', help='Use SSE transport')
|
|
69
|
+
parser.add_argument('--port', type=int, default=8888, help='Port to run the server on')
|
|
70
|
+
|
|
71
|
+
args = parser.parse_args()
|
|
72
|
+
|
|
73
|
+
logger.trace('A trace message.')
|
|
74
|
+
logger.debug('A debug message.')
|
|
75
|
+
logger.info('An info message.')
|
|
76
|
+
logger.success('A success message.')
|
|
77
|
+
logger.warning('A warning message.')
|
|
78
|
+
logger.error('An error message.')
|
|
79
|
+
logger.critical('A critical message.')
|
|
80
|
+
|
|
81
|
+
# Run server with appropriate transport
|
|
82
|
+
if args.sse:
|
|
83
|
+
mcp.settings.port = args.port
|
|
84
|
+
mcp.run(transport='sse')
|
|
85
|
+
else:
|
|
86
|
+
mcp.run()
|
|
87
|
+
|
|
88
|
+
|
|
89
|
+
if __name__ == '__main__':
|
|
90
|
+
main()
|
|
@@ -0,0 +1,251 @@
|
|
|
1
|
+
# Web application development instructions
|
|
2
|
+
|
|
3
|
+
## Introduction
|
|
4
|
+
This document provides instructions to create a custom web applications based on a frontend starter template. The template uses React, Tailwind CSS, React Router v7, shadcn UI components, AWS Amplify, and Zustand for state management. You should use this information to analyze user requirements, suggest appropriate approaches, and provide implementation steps for customizing the reference template to meet their specific needs. Follow the structured approach outlined below to deliver high-quality applications efficiently while maintaining consistency with the existing architecture and best practices.
|
|
5
|
+
|
|
6
|
+
## Important
|
|
7
|
+
- Authentication, basic routing, and private/public layouts are already implemented
|
|
8
|
+
- Sample dashboard and settings pages exist as reference
|
|
9
|
+
- AWS backend integration will be handled separately
|
|
10
|
+
- If you run into issues, you MUST seek guidance from the AWSLabs Frontend MCP server under the "Troubleshooting" topic.
|
|
11
|
+
|
|
12
|
+
## Project Implementation Flow
|
|
13
|
+
|
|
14
|
+
### 0. Requirements Analysis
|
|
15
|
+
- Generate a modern app name and description
|
|
16
|
+
- Identify the primary color for the app if provided by the user, if not use shadcn defaults (usually #171717)
|
|
17
|
+
- Identify target users and primary purpose
|
|
18
|
+
- List and prioritize core features
|
|
19
|
+
- Map features to existing template structure
|
|
20
|
+
- Identify new pages and components needed
|
|
21
|
+
- Reuse the current authentication layouts and flow
|
|
22
|
+
- Reuse the current private page layout, with the application sidebar on the left and page content on the right
|
|
23
|
+
- Always include a dashboard page as the start page, and incorporate charts and lists based on the functional needs of the application
|
|
24
|
+
- Incorporate an AI Chat assistant to the application if helpful
|
|
25
|
+
- Make the UI design contemporary, clean and minimal.
|
|
26
|
+
|
|
27
|
+
### 1. Document your plan
|
|
28
|
+
|
|
29
|
+
Once you have completed your analysis, you MUST create a CHECKLIST.md in the root folder of the project with two clearly defined sections:
|
|
30
|
+
|
|
31
|
+
**Section 1: Application Analysis**
|
|
32
|
+
- Application name and description
|
|
33
|
+
- Target users and primary purpose
|
|
34
|
+
- Core features (prioritized list)
|
|
35
|
+
- Be specific and detailed for each feature
|
|
36
|
+
- Include success criteria for each feature
|
|
37
|
+
- Identify which features require backend integration
|
|
38
|
+
- Complete page list with brief descriptions for each page
|
|
39
|
+
- Detail EVERY page needed for the application
|
|
40
|
+
- Include purpose, key components, and data needs for each page
|
|
41
|
+
- Map pages to features they support
|
|
42
|
+
- Data models/entities needed
|
|
43
|
+
- UI components required for implementation
|
|
44
|
+
- List shadcn components to be used for each page
|
|
45
|
+
- Identify any custom components needed
|
|
46
|
+
|
|
47
|
+
**Example: Task Tracking App**
|
|
48
|
+
```markdown
|
|
49
|
+
# TaskFlow Application Analysis
|
|
50
|
+
|
|
51
|
+
## Application Overview
|
|
52
|
+
- **Name**: TaskFlow
|
|
53
|
+
- **Description**: A collaborative task tracking application for small teams
|
|
54
|
+
- **Target Users**: Small teams (5-15 people), project managers, freelancers
|
|
55
|
+
- **Primary Purpose**: Simplify task management and improve team coordination
|
|
56
|
+
|
|
57
|
+
## Core Features (Prioritized)
|
|
58
|
+
1. **Task Management**
|
|
59
|
+
- Create, edit, delete tasks with title, description, due date, priority
|
|
60
|
+
- Assign tasks to team members
|
|
61
|
+
- Success criteria: Users can perform all CRUD operations on tasks
|
|
62
|
+
- Backend integration: Required for persistent storage
|
|
63
|
+
|
|
64
|
+
2. **Task Board Views**
|
|
65
|
+
- Kanban board with customizable columns (Todo, In Progress, Done)
|
|
66
|
+
- List view with sorting and filtering options
|
|
67
|
+
- Success criteria: Users can switch between views and drag-drop tasks
|
|
68
|
+
- Backend integration: Required for state persistence
|
|
69
|
+
|
|
70
|
+
3. **Team Collaboration**
|
|
71
|
+
- Comment on tasks
|
|
72
|
+
- @mention team members
|
|
73
|
+
- Success criteria: Users receive notifications when mentioned
|
|
74
|
+
- Backend integration: Required for notifications
|
|
75
|
+
|
|
76
|
+
## Page List
|
|
77
|
+
1. **Dashboard**
|
|
78
|
+
- Purpose: Overview of tasks, recent activity, and team performance
|
|
79
|
+
- Components: Task summary cards, activity feed, progress charts
|
|
80
|
+
- Data: Task counts by status, recent activities, completion rates
|
|
81
|
+
|
|
82
|
+
2. **Task Board**
|
|
83
|
+
- Purpose: Visual kanban-style task management
|
|
84
|
+
- Components: Drag-drop columns, task cards, filtering controls
|
|
85
|
+
- Data: All tasks with status, assignee, priority information
|
|
86
|
+
|
|
87
|
+
3. **Task Details**
|
|
88
|
+
- Purpose: View and edit detailed task information
|
|
89
|
+
- Components: Form fields, comments section, activity log
|
|
90
|
+
- Data: Single task with full details and comment history
|
|
91
|
+
|
|
92
|
+
4. **Team Members**
|
|
93
|
+
- Purpose: Manage team members and view their tasks
|
|
94
|
+
- Components: User list, user profile cards, assigned tasks
|
|
95
|
+
- Data: User profiles and task assignments
|
|
96
|
+
|
|
97
|
+
5. **Settings**
|
|
98
|
+
- Purpose: Configure application preferences
|
|
99
|
+
- Components: Form fields for notification settings, theme options
|
|
100
|
+
- Data: User preferences
|
|
101
|
+
|
|
102
|
+
## Data Models
|
|
103
|
+
1. **Task**
|
|
104
|
+
- id, title, description, status, priority, dueDate, assigneeId, createdAt
|
|
105
|
+
|
|
106
|
+
2. **User**
|
|
107
|
+
- id, name, email, avatar, role
|
|
108
|
+
|
|
109
|
+
3. **Comment**
|
|
110
|
+
- id, taskId, userId, content, createdAt
|
|
111
|
+
|
|
112
|
+
## UI Components
|
|
113
|
+
1. **Dashboard Page**
|
|
114
|
+
- shadcn: Card, Tabs, Avatar, Button, Select
|
|
115
|
+
- Custom: TaskSummaryCard, ActivityFeed
|
|
116
|
+
|
|
117
|
+
2. **Task Board Page**
|
|
118
|
+
- shadcn: Card, Badge, Avatar, Button, DropdownMenu
|
|
119
|
+
- Custom: DraggableTaskCard, KanbanColumn
|
|
120
|
+
|
|
121
|
+
3. **Task Details Page**
|
|
122
|
+
- shadcn: Form, Input, Textarea, Select, Button, Tabs, ScrollArea
|
|
123
|
+
- Custom: CommentThread, TaskActivityLog
|
|
124
|
+
|
|
125
|
+
4. **Team Members Page**
|
|
126
|
+
- shadcn: Card, Avatar, Table, Dialog, Badge
|
|
127
|
+
- Custom: UserProfileCard, TaskAssignmentList
|
|
128
|
+
|
|
129
|
+
5. **Settings Page**
|
|
130
|
+
- shadcn: Form, Switch, RadioGroup, Separator, Button
|
|
131
|
+
- Custom: NotificationPreferences
|
|
132
|
+
```
|
|
133
|
+
|
|
134
|
+
**Section 2: Implementation Checklist**
|
|
135
|
+
- [ ] Generate a modern app name/description and a project folder name [app-name] based on the app name
|
|
136
|
+
- [ ] Clone repo to [app-name] folder and install dependencies
|
|
137
|
+
- [ ] Update the README.md based on your analysis of the codebase and frontend stack
|
|
138
|
+
- [ ] Update package.json name and app name references
|
|
139
|
+
- [ ] Update app name and description on the login page
|
|
140
|
+
- [ ] Generate favicon.png and splash.png images using nova canvas MCP server
|
|
141
|
+
- [ ] Create mock amplify_outputs.json file
|
|
142
|
+
- [ ] Add/update pages and required components, using shadcn components
|
|
143
|
+
- [ ] Extend routing structure
|
|
144
|
+
- [ ] Add sample data to Zustand store
|
|
145
|
+
- [ ] Update navigation
|
|
146
|
+
- [ ] Ensure all required pages are created and wired up
|
|
147
|
+
|
|
148
|
+
As you go through the implementation, keep updating the checklist to ensure that you have completely created all the pages and features necessary to meet the functional needs of the application. The analysis section should be completed BEFORE beginning any implementation tasks.
|
|
149
|
+
|
|
150
|
+
### 2. Setup & Configuration
|
|
151
|
+
```bash
|
|
152
|
+
# Clone repository into [app-name] folder
|
|
153
|
+
git clone -b starterkits https://github.com/awslabs/mcp.git [app-name]
|
|
154
|
+
# navigate to the frontend folder
|
|
155
|
+
cd [app-name]/frontend
|
|
156
|
+
# install packages
|
|
157
|
+
npm install
|
|
158
|
+
```
|
|
159
|
+
|
|
160
|
+
Analyze this code base after cloning to understand how it is structured and the key architectural patterns and frontend stack.
|
|
161
|
+
|
|
162
|
+
Based on your analysis, update the README.md with an overview of the functional goal of the application and the frontend stack, including specific versions (e.g. React 18 instead of just React)
|
|
163
|
+
|
|
164
|
+
**PHASE VERIFICATION**: Ensure repository is cloned successfully and all dependencies are installed without errors. Confirm README.md is updated with accurate information.
|
|
165
|
+
|
|
166
|
+
### 3. Application Branding & Identity
|
|
167
|
+
- Update package.json with new application name
|
|
168
|
+
- Update app name references in components (e.g., app-sidebar.tsx)
|
|
169
|
+
- Update the app name and description on the login page
|
|
170
|
+
- Update document title and metadata in index.html
|
|
171
|
+
- Customize the primary color for the application using Tailwind if the user has provided a custom primary color for the app
|
|
172
|
+
- When setting primary color, you MUST update both the Tailwind and Amplify theme to keep them in sync
|
|
173
|
+
- Use Nova Canvas MCP Server to create the following 2 images:
|
|
174
|
+
- **favicon.png (320x320)**
|
|
175
|
+
- Create a minimal abstract icon that represents the app concept
|
|
176
|
+
- Use monochromatic shades of the primary color
|
|
177
|
+
- Design should be simple enough to be recognizable at small sizes
|
|
178
|
+
- Avoid text or complex details that won't scale down well
|
|
179
|
+
- **splash.png (1024x1024)**
|
|
180
|
+
- Create a compelling minimal abstract conceptual editorial illustration relevant to the concept of the app
|
|
181
|
+
- Use primarily dark shades of the primary color with subtle accent colors if appropriate
|
|
182
|
+
- Design should convey the app's purpose through abstract visual elements
|
|
183
|
+
- Can include subtle patterns, gradients, or geometric shapes
|
|
184
|
+
- You MUST use 'mv' to move the generated image and overwrite the existing image, as users can be on Windows or Unix systems and the 'move' command might not be available.
|
|
185
|
+
|
|
186
|
+
```bash
|
|
187
|
+
mv source-folder/file destination-folder/file
|
|
188
|
+
```
|
|
189
|
+
|
|
190
|
+
- Replace existing app icon references with generated favicon.png
|
|
191
|
+
|
|
192
|
+
**PHASE VERIFICATION**: Confirm all branding elements are consistently updated throughout the application. Verify both favicon.png and splash.png are properly generated and placed in the public folder.
|
|
193
|
+
|
|
194
|
+
### 4. UI Development
|
|
195
|
+
- Add new pages following existing patterns
|
|
196
|
+
- Reuse existing pages, layouts, components where possible
|
|
197
|
+
- Install or use shadcn components vs. creating custom components where possible
|
|
198
|
+
- Add required shadcn components: `npx shadcn add [component-name]`
|
|
199
|
+
- Keep component organization flat and simple
|
|
200
|
+
- Extend routing using react-router v7 as configured
|
|
201
|
+
- Update navigation components
|
|
202
|
+
- Add sample data to the Zustand store
|
|
203
|
+
|
|
204
|
+
**PHASE VERIFICATION**: Ensure all pages in the application analysis document are implemented. Verify routing works correctly between all pages. Confirm components use shadcn UI where appropriate.
|
|
205
|
+
|
|
206
|
+
### 5. Backend Configuration
|
|
207
|
+
- Create a mock `amplify_outputs.json` file for development
|
|
208
|
+
- Structure it to match expected backend resources
|
|
209
|
+
- This file will later be updated by an external build process
|
|
210
|
+
|
|
211
|
+
**PHASE VERIFICATION**: Confirm the mock amplify_outputs.json file is correctly formatted and contains all necessary configuration for local development.
|
|
212
|
+
|
|
213
|
+
**Example: Task App Mock Backend Configuration**
|
|
214
|
+
```json
|
|
215
|
+
{
|
|
216
|
+
"auth": {
|
|
217
|
+
"userPoolId": "mock-user-pool-id",
|
|
218
|
+
"userPoolWebClientId": "mock-client-id",
|
|
219
|
+
"region": "us-east-1",
|
|
220
|
+
"identityPoolId": "mock-identity-pool-id"
|
|
221
|
+
},
|
|
222
|
+
"api": {
|
|
223
|
+
"endpoints": [
|
|
224
|
+
{
|
|
225
|
+
"name": "TasksAPI",
|
|
226
|
+
"endpoint": "https://example.com/api/tasks",
|
|
227
|
+
"region": "us-east-1"
|
|
228
|
+
}
|
|
229
|
+
]
|
|
230
|
+
}
|
|
231
|
+
}
|
|
232
|
+
```
|
|
233
|
+
|
|
234
|
+
## Technical Guidelines
|
|
235
|
+
|
|
236
|
+
### State Management
|
|
237
|
+
- Always use central Zustand store instead of component state
|
|
238
|
+
- Avoid prop drilling completely
|
|
239
|
+
- Components should access store directly via hooks
|
|
240
|
+
- Only use component state for temporary UI states (form inputs while typing)
|
|
241
|
+
|
|
242
|
+
### Component Organization
|
|
243
|
+
- Keep component organization flat
|
|
244
|
+
- Place new components in appropriate existing folders
|
|
245
|
+
- Don't group by features unless app is complex
|
|
246
|
+
- Follow existing naming conventions
|
|
247
|
+
- Always use shadcn components if available
|
|
248
|
+
|
|
249
|
+
## Final check
|
|
250
|
+
|
|
251
|
+
Conduct a final check to make sure that all items in the CHECKLIST.md are completed with a high level of quality and there are no errors or missing functionality.
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
# Solutions to common issues when generating code for the application
|
|
2
|
+
|
|
3
|
+
- Always check for guidance from the awslabs.frontend-mcp-server MCP server when implementing new features or adding new pages
|
|
4
|
+
- Routing - always the already installed react-router v7 in Declarative mode for routing. Do not use the outdated react-router-dom package
|
|
5
|
+
- Components - always look for existing shadcn components before attempting to create new custom components
|
|
6
|
+
- Copying/Moving files - the user might be on Windows, try cross-platform commands
|
|
7
|
+
- Generating Images - a minimum resolution of 320x320 is required for Nova Canvas MCP server to generate images
|
|
8
|
+
- Creating Charts - Use shadcn charts for any charting https://ui.shadcn.com/charts
|
|
9
|
+
|
|
10
|
+
In addition:
|
|
11
|
+
- You MUST carefully analyze the current patterns and packages before suggesting structural or dependency changes
|
|
12
|
+
- Avoid changing existing layouts, login.tsx, app-sidebar.tsx, and authentication and keep any required changes minimal
|
|
13
|
+
- When adding new features, don't complete the analysis prematurely, continue analyzing even if you think you found a solution
|
|
14
|
+
- Ensure the code is complete and pages and components for new features are implemented fully and connected with the rest of the application
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"""Utility functions for the frontend MCP server."""
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"""File utility functions for the frontend MCP server."""
|
|
2
|
+
|
|
3
|
+
from pathlib import Path
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
def load_markdown_file(filename: str) -> str:
|
|
7
|
+
"""Load a markdown file from the static/react directory.
|
|
8
|
+
|
|
9
|
+
Args:
|
|
10
|
+
filename (str): The name of the markdown file to load (e.g. 'basic-ui-setup.md')
|
|
11
|
+
|
|
12
|
+
Returns:
|
|
13
|
+
str: The content of the markdown file, or empty string if file not found
|
|
14
|
+
"""
|
|
15
|
+
base_dir = Path(__file__).parent.parent
|
|
16
|
+
react_dir = base_dir / 'static' / 'react'
|
|
17
|
+
file_path = react_dir / filename
|
|
18
|
+
|
|
19
|
+
if file_path.exists():
|
|
20
|
+
with open(file_path, 'r', encoding='utf-8') as f:
|
|
21
|
+
return f.read()
|
|
22
|
+
else:
|
|
23
|
+
print(f'Warning: File not found: {file_path}')
|
|
24
|
+
return ''
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
Metadata-Version: 2.4
|
|
2
|
+
Name: awslabs.frontend-mcp-server
|
|
3
|
+
Version: 0.0.1
|
|
4
|
+
Summary: An AWS Labs Model Context Protocol (MCP) server for frontend
|
|
5
|
+
Project-URL: homepage, https://awslabs.github.io/mcp/
|
|
6
|
+
Project-URL: docs, https://awslabs.github.io/mcp/servers/frontend-mcp-server/
|
|
7
|
+
Project-URL: documentation, https://awslabs.github.io/mcp/servers/frontend-mcp-server/
|
|
8
|
+
Project-URL: repository, https://github.com/awslabs/mcp.git
|
|
9
|
+
Project-URL: changelog, https://github.com/awslabs/mcp/blob/main/src/frontend-mcp-server/CHANGELOG.md
|
|
10
|
+
Author: Amazon Web Services
|
|
11
|
+
Author-email: AWSLabs MCP <203918161+awslabs-mcp@users.noreply.github.com>, Jimin Kim <jimini55@users.noreply.github.com>
|
|
12
|
+
License: Apache-2.0
|
|
13
|
+
License-File: LICENSE
|
|
14
|
+
License-File: NOTICE
|
|
15
|
+
Classifier: License :: OSI Approved :: Apache Software License
|
|
16
|
+
Classifier: Operating System :: OS Independent
|
|
17
|
+
Classifier: Programming Language :: Python
|
|
18
|
+
Classifier: Programming Language :: Python :: 3
|
|
19
|
+
Classifier: Programming Language :: Python :: 3.10
|
|
20
|
+
Classifier: Programming Language :: Python :: 3.11
|
|
21
|
+
Classifier: Programming Language :: Python :: 3.12
|
|
22
|
+
Classifier: Programming Language :: Python :: 3.13
|
|
23
|
+
Requires-Python: >=3.10
|
|
24
|
+
Requires-Dist: loguru>=0.7.0
|
|
25
|
+
Requires-Dist: mcp[cli]>=1.6.0
|
|
26
|
+
Requires-Dist: pydantic>=2.10.6
|
|
27
|
+
Description-Content-Type: text/markdown
|
|
28
|
+
|
|
29
|
+
# AWS Labs Frontend MCP Server
|
|
30
|
+
|
|
31
|
+
[](https://smithery.ai/server/@awslabs/frontend-mcp-server)
|
|
32
|
+
|
|
33
|
+
A Model Context Protocol (MCP) server that provides specialized tools for modern web application development.
|
|
34
|
+
|
|
35
|
+
## Features
|
|
36
|
+
|
|
37
|
+
### Modern React Application Documentation
|
|
38
|
+
|
|
39
|
+
This MCP Server provides comprehensive documentation on modern React application development through its `GetReactDocsByTopic` tool, which offers guidance on:
|
|
40
|
+
|
|
41
|
+
- **Essential Knowledge**: Fundamental concepts for building React applications
|
|
42
|
+
- **Basic UI Setup**: Setting up a React project with Tailwind CSS and shadcn/ui
|
|
43
|
+
- **Authentication**: AWS Amplify authentication integration
|
|
44
|
+
- **Routing**: Implementing routing with React Router
|
|
45
|
+
- **Customizing**: Theming with AWS Amplify components
|
|
46
|
+
- **Creating Components**: Building React components with AWS integrations
|
|
47
|
+
- **Troubleshooting**: Common issues and solutions for React development
|
|
48
|
+
|
|
49
|
+
## Prerequisites
|
|
50
|
+
|
|
51
|
+
1. Install `uv` from [Astral](https://docs.astral.sh/uv/getting-started/installation/) or the [GitHub README](https://github.com/astral-sh/uv#installation)
|
|
52
|
+
2. Install Python using `uv python install 3.10`
|
|
53
|
+
|
|
54
|
+
## Installation
|
|
55
|
+
|
|
56
|
+
Here are some ways you can work with MCP across AWS, and we'll be adding support to more products including Amazon Q Developer CLI soon: (e.g. for Amazon Q Developer CLI MCP, `~/.aws/amazonq/mcp.json`):
|
|
57
|
+
|
|
58
|
+
```json
|
|
59
|
+
{
|
|
60
|
+
"mcpServers": {
|
|
61
|
+
"awslabs.frontend-mcp-server": {
|
|
62
|
+
"command": "uvx",
|
|
63
|
+
"args": ["awslabs.frontend-mcp-server@latest"],
|
|
64
|
+
"env": {
|
|
65
|
+
"FASTMCP_LOG_LEVEL": "ERROR"
|
|
66
|
+
},
|
|
67
|
+
"disabled": false,
|
|
68
|
+
"autoApprove": []
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
```
|
|
73
|
+
|
|
74
|
+
## Usage
|
|
75
|
+
|
|
76
|
+
The Frontend MCP Server provides the `GetReactDocsByTopic` tool for accessing specialized documentation on modern web application development with AWS technologies. This server will instruct the caller to clone a base web application repo and use that as the starting point for customization.
|
|
77
|
+
|
|
78
|
+
### GetReactDocsByTopic
|
|
79
|
+
|
|
80
|
+
This tool retrieves comprehensive documentation on specific React and AWS integration topics. To use it, specify which topic you need information on:
|
|
81
|
+
|
|
82
|
+
```python
|
|
83
|
+
result = await get_react_docs_by_topic('essential-knowledge')
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
Available topics:
|
|
87
|
+
|
|
88
|
+
1. **essential-knowledge**: Foundational concepts for building React applications with AWS services
|
|
89
|
+
2. **troubleshooting**: Common issues and solutions for React development with AWS integrations
|
|
90
|
+
|
|
91
|
+
Each topic returns comprehensive markdown documentation with explanations, code examples, and implementation guidance.
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
awslabs/__init__.py,sha256=47wJeKcStxEJwX7SVVV2pnAWYR8FxcaYoT3YTmZ5Plg,674
|
|
2
|
+
awslabs/frontend_mcp_server/__init__.py,sha256=PM0HjBXxo6pzqf6AHjqT9F6R_RB_WafgbkgTBO-z3G4,616
|
|
3
|
+
awslabs/frontend_mcp_server/server.py,sha256=ZpXBzlaHocp08aUTSXgHLtq7IYO4mePxpvhQjydl4-8,3337
|
|
4
|
+
awslabs/frontend_mcp_server/static/react/essential-knowledge.md,sha256=XdvbkUCyBc0_SiHYbb-a8BFcHaVJA4xttZGKAzMK3Dg,11189
|
|
5
|
+
awslabs/frontend_mcp_server/static/react/troubleshooting.md,sha256=QwvnxGnkgddlg7zO3HuBh9MerIyDDa_LssGZPw371ew,1240
|
|
6
|
+
awslabs/frontend_mcp_server/utils/__init__.py,sha256=Jbns_5gM4Rb-ORTnUQzAFLJDrDGoqntZPruhDdsnT0k,53
|
|
7
|
+
awslabs/frontend_mcp_server/utils/file_utils.py,sha256=LKprH8kVwGcvjGmz8bCEanwlDLELpKUCqqv3ylaSr2c,720
|
|
8
|
+
awslabs_frontend_mcp_server-0.0.1.dist-info/METADATA,sha256=zsx6O6w2oy6PG-WEoMYLZLtx771sJ1fjnFjGX8WgxAg,3878
|
|
9
|
+
awslabs_frontend_mcp_server-0.0.1.dist-info/WHEEL,sha256=qtCwoSJWgHk21S1Kb4ihdzI2rlJ1ZKaIurTj_ngOhyQ,87
|
|
10
|
+
awslabs_frontend_mcp_server-0.0.1.dist-info/entry_points.txt,sha256=oWaTyJPjUC1J5E1xzlD2uTTB5USF9lfV8WmiryUi14s,88
|
|
11
|
+
awslabs_frontend_mcp_server-0.0.1.dist-info/licenses/LICENSE,sha256=CeipvOyAZxBGUsFoaFqwkx54aPnIKEtm9a5u2uXxEws,10142
|
|
12
|
+
awslabs_frontend_mcp_server-0.0.1.dist-info/licenses/NOTICE,sha256=A-DPzBCgbxvwvk0Lzog3Sbq3tkDmIJbM7IZAt-ikdW4,95
|
|
13
|
+
awslabs_frontend_mcp_server-0.0.1.dist-info/RECORD,,
|
|
@@ -0,0 +1,175 @@
|
|
|
1
|
+
|
|
2
|
+
Apache License
|
|
3
|
+
Version 2.0, January 2004
|
|
4
|
+
http://www.apache.org/licenses/
|
|
5
|
+
|
|
6
|
+
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
|
7
|
+
|
|
8
|
+
1. Definitions.
|
|
9
|
+
|
|
10
|
+
"License" shall mean the terms and conditions for use, reproduction,
|
|
11
|
+
and distribution as defined by Sections 1 through 9 of this document.
|
|
12
|
+
|
|
13
|
+
"Licensor" shall mean the copyright owner or entity authorized by
|
|
14
|
+
the copyright owner that is granting the License.
|
|
15
|
+
|
|
16
|
+
"Legal Entity" shall mean the union of the acting entity and all
|
|
17
|
+
other entities that control, are controlled by, or are under common
|
|
18
|
+
control with that entity. For the purposes of this definition,
|
|
19
|
+
"control" means (i) the power, direct or indirect, to cause the
|
|
20
|
+
direction or management of such entity, whether by contract or
|
|
21
|
+
otherwise, or (ii) ownership of fifty percent (50%) or more of the
|
|
22
|
+
outstanding shares, or (iii) beneficial ownership of such entity.
|
|
23
|
+
|
|
24
|
+
"You" (or "Your") shall mean an individual or Legal Entity
|
|
25
|
+
exercising permissions granted by this License.
|
|
26
|
+
|
|
27
|
+
"Source" form shall mean the preferred form for making modifications,
|
|
28
|
+
including but not limited to software source code, documentation
|
|
29
|
+
source, and configuration files.
|
|
30
|
+
|
|
31
|
+
"Object" form shall mean any form resulting from mechanical
|
|
32
|
+
transformation or translation of a Source form, including but
|
|
33
|
+
not limited to compiled object code, generated documentation,
|
|
34
|
+
and conversions to other media types.
|
|
35
|
+
|
|
36
|
+
"Work" shall mean the work of authorship, whether in Source or
|
|
37
|
+
Object form, made available under the License, as indicated by a
|
|
38
|
+
copyright notice that is included in or attached to the work
|
|
39
|
+
(an example is provided in the Appendix below).
|
|
40
|
+
|
|
41
|
+
"Derivative Works" shall mean any work, whether in Source or Object
|
|
42
|
+
form, that is based on (or derived from) the Work and for which the
|
|
43
|
+
editorial revisions, annotations, elaborations, or other modifications
|
|
44
|
+
represent, as a whole, an original work of authorship. For the purposes
|
|
45
|
+
of this License, Derivative Works shall not include works that remain
|
|
46
|
+
separable from, or merely link (or bind by name) to the interfaces of,
|
|
47
|
+
the Work and Derivative Works thereof.
|
|
48
|
+
|
|
49
|
+
"Contribution" shall mean any work of authorship, including
|
|
50
|
+
the original version of the Work and any modifications or additions
|
|
51
|
+
to that Work or Derivative Works thereof, that is intentionally
|
|
52
|
+
submitted to Licensor for inclusion in the Work by the copyright owner
|
|
53
|
+
or by an individual or Legal Entity authorized to submit on behalf of
|
|
54
|
+
the copyright owner. For the purposes of this definition, "submitted"
|
|
55
|
+
means any form of electronic, verbal, or written communication sent
|
|
56
|
+
to the Licensor or its representatives, including but not limited to
|
|
57
|
+
communication on electronic mailing lists, source code control systems,
|
|
58
|
+
and issue tracking systems that are managed by, or on behalf of, the
|
|
59
|
+
Licensor for the purpose of discussing and improving the Work, but
|
|
60
|
+
excluding communication that is conspicuously marked or otherwise
|
|
61
|
+
designated in writing by the copyright owner as "Not a Contribution."
|
|
62
|
+
|
|
63
|
+
"Contributor" shall mean Licensor and any individual or Legal Entity
|
|
64
|
+
on behalf of whom a Contribution has been received by Licensor and
|
|
65
|
+
subsequently incorporated within the Work.
|
|
66
|
+
|
|
67
|
+
2. Grant of Copyright License. Subject to the terms and conditions of
|
|
68
|
+
this License, each Contributor hereby grants to You a perpetual,
|
|
69
|
+
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
|
70
|
+
copyright license to reproduce, prepare Derivative Works of,
|
|
71
|
+
publicly display, publicly perform, sublicense, and distribute the
|
|
72
|
+
Work and such Derivative Works in Source or Object form.
|
|
73
|
+
|
|
74
|
+
3. Grant of Patent License. Subject to the terms and conditions of
|
|
75
|
+
this License, each Contributor hereby grants to You a perpetual,
|
|
76
|
+
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
|
77
|
+
(except as stated in this section) patent license to make, have made,
|
|
78
|
+
use, offer to sell, sell, import, and otherwise transfer the Work,
|
|
79
|
+
where such license applies only to those patent claims licensable
|
|
80
|
+
by such Contributor that are necessarily infringed by their
|
|
81
|
+
Contribution(s) alone or by combination of their Contribution(s)
|
|
82
|
+
with the Work to which such Contribution(s) was submitted. If You
|
|
83
|
+
institute patent litigation against any entity (including a
|
|
84
|
+
cross-claim or counterclaim in a lawsuit) alleging that the Work
|
|
85
|
+
or a Contribution incorporated within the Work constitutes direct
|
|
86
|
+
or contributory patent infringement, then any patent licenses
|
|
87
|
+
granted to You under this License for that Work shall terminate
|
|
88
|
+
as of the date such litigation is filed.
|
|
89
|
+
|
|
90
|
+
4. Redistribution. You may reproduce and distribute copies of the
|
|
91
|
+
Work or Derivative Works thereof in any medium, with or without
|
|
92
|
+
modifications, and in Source or Object form, provided that You
|
|
93
|
+
meet the following conditions:
|
|
94
|
+
|
|
95
|
+
(a) You must give any other recipients of the Work or
|
|
96
|
+
Derivative Works a copy of this License; and
|
|
97
|
+
|
|
98
|
+
(b) You must cause any modified files to carry prominent notices
|
|
99
|
+
stating that You changed the files; and
|
|
100
|
+
|
|
101
|
+
(c) You must retain, in the Source form of any Derivative Works
|
|
102
|
+
that You distribute, all copyright, patent, trademark, and
|
|
103
|
+
attribution notices from the Source form of the Work,
|
|
104
|
+
excluding those notices that do not pertain to any part of
|
|
105
|
+
the Derivative Works; and
|
|
106
|
+
|
|
107
|
+
(d) If the Work includes a "NOTICE" text file as part of its
|
|
108
|
+
distribution, then any Derivative Works that You distribute must
|
|
109
|
+
include a readable copy of the attribution notices contained
|
|
110
|
+
within such NOTICE file, excluding those notices that do not
|
|
111
|
+
pertain to any part of the Derivative Works, in at least one
|
|
112
|
+
of the following places: within a NOTICE text file distributed
|
|
113
|
+
as part of the Derivative Works; within the Source form or
|
|
114
|
+
documentation, if provided along with the Derivative Works; or,
|
|
115
|
+
within a display generated by the Derivative Works, if and
|
|
116
|
+
wherever such third-party notices normally appear. The contents
|
|
117
|
+
of the NOTICE file are for informational purposes only and
|
|
118
|
+
do not modify the License. You may add Your own attribution
|
|
119
|
+
notices within Derivative Works that You distribute, alongside
|
|
120
|
+
or as an addendum to the NOTICE text from the Work, provided
|
|
121
|
+
that such additional attribution notices cannot be construed
|
|
122
|
+
as modifying the License.
|
|
123
|
+
|
|
124
|
+
You may add Your own copyright statement to Your modifications and
|
|
125
|
+
may provide additional or different license terms and conditions
|
|
126
|
+
for use, reproduction, or distribution of Your modifications, or
|
|
127
|
+
for any such Derivative Works as a whole, provided Your use,
|
|
128
|
+
reproduction, and distribution of the Work otherwise complies with
|
|
129
|
+
the conditions stated in this License.
|
|
130
|
+
|
|
131
|
+
5. Submission of Contributions. Unless You explicitly state otherwise,
|
|
132
|
+
any Contribution intentionally submitted for inclusion in the Work
|
|
133
|
+
by You to the Licensor shall be under the terms and conditions of
|
|
134
|
+
this License, without any additional terms or conditions.
|
|
135
|
+
Notwithstanding the above, nothing herein shall supersede or modify
|
|
136
|
+
the terms of any separate license agreement you may have executed
|
|
137
|
+
with Licensor regarding such Contributions.
|
|
138
|
+
|
|
139
|
+
6. Trademarks. This License does not grant permission to use the trade
|
|
140
|
+
names, trademarks, service marks, or product names of the Licensor,
|
|
141
|
+
except as required for reasonable and customary use in describing the
|
|
142
|
+
origin of the Work and reproducing the content of the NOTICE file.
|
|
143
|
+
|
|
144
|
+
7. Disclaimer of Warranty. Unless required by applicable law or
|
|
145
|
+
agreed to in writing, Licensor provides the Work (and each
|
|
146
|
+
Contributor provides its Contributions) on an "AS IS" BASIS,
|
|
147
|
+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
|
148
|
+
implied, including, without limitation, any warranties or conditions
|
|
149
|
+
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
|
|
150
|
+
PARTICULAR PURPOSE. You are solely responsible for determining the
|
|
151
|
+
appropriateness of using or redistributing the Work and assume any
|
|
152
|
+
risks associated with Your exercise of permissions under this License.
|
|
153
|
+
|
|
154
|
+
8. Limitation of Liability. In no event and under no legal theory,
|
|
155
|
+
whether in tort (including negligence), contract, or otherwise,
|
|
156
|
+
unless required by applicable law (such as deliberate and grossly
|
|
157
|
+
negligent acts) or agreed to in writing, shall any Contributor be
|
|
158
|
+
liable to You for damages, including any direct, indirect, special,
|
|
159
|
+
incidental, or consequential damages of any character arising as a
|
|
160
|
+
result of this License or out of the use or inability to use the
|
|
161
|
+
Work (including but not limited to damages for loss of goodwill,
|
|
162
|
+
work stoppage, computer failure or malfunction, or any and all
|
|
163
|
+
other commercial damages or losses), even if such Contributor
|
|
164
|
+
has been advised of the possibility of such damages.
|
|
165
|
+
|
|
166
|
+
9. Accepting Warranty or Additional Liability. While redistributing
|
|
167
|
+
the Work or Derivative Works thereof, You may choose to offer,
|
|
168
|
+
and charge a fee for, acceptance of support, warranty, indemnity,
|
|
169
|
+
or other liability obligations and/or rights consistent with this
|
|
170
|
+
License. However, in accepting such obligations, You may act only
|
|
171
|
+
on Your own behalf and on Your sole responsibility, not on behalf
|
|
172
|
+
of any other Contributor, and only if You agree to indemnify,
|
|
173
|
+
defend, and hold each Contributor harmless for any liability
|
|
174
|
+
incurred by, or claims asserted against, such Contributor by reason
|
|
175
|
+
of your accepting any such warranty or additional liability.
|