0 vistas· 05/28/26· Cómo hacer y estilo

Hướng dẫn sử dụng MCP Server để tự động sinh Code Frontend từ thiết kế Figma


Bạn muốn tăng tốc phát triển giao diện mà không cần viết lại từng dòng code từ thiết kế? Trong video này, mình sẽ hướng dẫn cách sử dụng MCP Server để tự động tạo code Frontend từ file thiết kế trên Figma!

📌 Những gì bạn sẽ học trong video này:
🔹 Cách cài đặt & sử dụng MCP Server
🔹 Kết nối với Figma để sinh code tự động
🔹 Tích hợp với Cursor, Cline, Roo Code để tối ưu quá trình làm Dev

💡 Tiết kiệm thời gian – Tăng hiệu suất

📥 Các câu lệnh trong video
🔹Khởi chạy server localhost:3333: npx figma-developer-mcp --figma-api-key=figma_api_key
🔹 Link lấy figma key: https://www.figma.com/developers/api
🔹Config MCP_Figma:
{
"mcpServers": {
"figma-developer-mcp": {
"url": "http://localhost:3333/sse"
}
}
}
🔹Câu prompt tạo giao diện: Tạo giao diện tại component AboutView.Vue dựa theo thiết kế figma sau: link_figma

🔗 kết nối với mình tại:
🔹 Facebook: facebook.com/cuong.viet.965lovesicknes
📧 Gmail: [email protected]
🔥 Linkedin: https://www.linkedin.com/in/c%....C6%B0%E1%BB%9Dng-ngu


🔥 Đừng quên Like, Share & Subscribe để không bỏ lỡ các mẹo lập trình hữu ích!

#FigmaToCode #MCPServer #VSCode #Frontend #Cursor #Cline #RooCode #AI🚀

Mostrar más

Hasta la próxima


0 Comentarios

Comentarios de Facebook