೨ ದಿನಗಳಲ್ಲಿ ೨೦ MCP Apps ನಿರ್ಮಿಸುವುದರಿಂದ ಕಲಿತ ಪಾಠಗಳು

ನನ್ನ ತಂಡವು ಎರಡು ದಿನಗಳಲ್ಲಿ 20 MCP Apps ನಿರ್ಮಿಸಿತು. ಈ ಪರಿಕರಗಳು (tools) ಏನು ಮಾಡುತ್ತವೆ ಮತ್ತು ಅವು ಎಲ್ಲಿ ವಿಫಲವಾಗುತ್ತವೆ ಎಂಬ ಬಗ್ಗೆ ಇದು ನನಗೆ ಸ್ಪಷ್ಟ ನೋಟವನ್ನು ನೀಡಿತು.

MCP Apps ಎಂಬುದು MCP spec ಗೆ ಮೊದಲ ಅಧಿಕೃತ ವಿಸ್ತರಣೆಯಾಗಿದೆ (extension). ಇವು ಒಂದು ಪರಿಕರವು ತನ್ನ ಫಲಿತಾಂಶದೊಂದಿಗೆ UI resource ಅನ್ನು ಹಿಂತಿರುಗಿಸಲು ಅನುವು ಮಾಡಿಕೊಡುತ್ತವೆ. Host ಈ UI ಅನ್ನು sandboxed iframe ನಲ್ಲಿ ಪ್ರದರ್ಶಿಸುತ್ತದೆ. ನೀವು ಚಾಟ್‌ನಲ್ಲಿ ನೇರವಾಗಿ ಟೇಬಲ್‌ಗಳು, ಚಾರ್ಟ್‌ಗಳು ಮತ್ತು ಫಾರ್ಮ್‌ಗಳನ್ನು ತೋರಿಸಬಹುದು.

ದೃಶ್ಯ ಮಾಹಿತಿ (Visual information) ಹೆಚ್ಚಾಗಿ ಪಠ್ಯಕ್ಕಿಂತ ಉತ್ತಮವಾಗಿರುತ್ತದೆ. ಒಂದು ಚಾರ್ಟ್ CSV ಫೈಲ್ಗಿಂತ ಉತ್ತಮವಾಗಿರುತ್ತದೆ. ಪಠ್ಯದ ರಾಶಿಗಿಂತ pull requests ಗಳ ಪಟ್ಟಿ ಓದಲು ಸುಲಭವಾಗಿರುತ್ತದೆ.

ನಾವು ಕಲಿತ ಪಾಠಗಳು ಇಲ್ಲಿವೆ:

• Apps ಸರ್ವರ್‌ನ ಒಳಗೇ ಇರುತ್ತವೆ An MCP App ಎಂಬುದು hosted URL ಅಲ್ಲ. ಇದನ್ನು MCP ಮೂಲಕ ಪಡೆಯಲಾಗುತ್ತದೆ, HTTP ಮೂಲಕ ಅಲ್ಲ. UI ಕೋಡ್ ನಿಮ್ಮ MCP server ನೊಂದಿಗೆ ಬರುತ್ತದೆ.

• React ಮತ್ತು Vite ಬಳಸಿ ನಮ್ಮ ಅಸ್ತಿತ್ವದಲ್ಲಿರುವ design system ಅನ್ನು ಬಳಸಲು ನಾವು React ಅನ್ನು ಬಳಸಿದೆವು. ನಾವು /ui ಫೋಲ್ಡರ್‌ನಲ್ಲಿ ಒಂದು Vite ಪ್ರಾಜೆಕ್ಟ್ ಅನ್ನು ಹೊಂದ设置 ಮಾಡಿದೆವು. ಇದು build ಮಾಡುವಾಗ ಪ್ರತಿ TSX ಫೈಲ್‌ಗೆ ಒಂದು HTML ಫೈಲ್ ಅನ್ನು ನೀಡುತ್ತದೆ.

• ಪಠ್ಯವೇ ಇನ್ನೂ ಪ್ರಾಥಮಿಕ ಒಪ್ಪಂದವಾಗಿದೆ ಒಂದು ವೇಳೆ host MCP Apps ಅನ್ನು ಬೆಂಬಲಿಸದಿದ್ದರೆ, ಅದು UI property ಅನ್ನು ನಿರ್ಲಕ್ಷಿಸುತ್ತದೆ. ಬಳಕೆದಾರರು ಕೇವಲ ಪಠ್ಯದ ಪ್ರತಿಕ್ರಿಯೆಯನ್ನು ಮಾತ್ರ ನೋಡುತ್ತಾರೆ. ನಿಮ್ಮ ಏಕೈಕ ಉತ್ತರವನ್ನು UI ನಲ್ಲಿ ಮಾತ್ರ ಇಡಬೇಡಿ. ಹಾಗೆ ಮಾಡಿದರೆ, terminal clients ಬಳಸುವ ಬಳಕೆದಾರರಿಗೆ ನಿಮ್ಮ ಪರಿಕರವು ಕೆಲಸ ಮಾಡುವುದಿಲ್ಲ. ನಿಮ್ಮ ಅರ್ಧದಷ್ಟು ಬಳಕೆದಾರರು ಕೇವಲ ಪಠ್ಯವನ್ನು ಮಾತ್ರ ನೋಡುತ್ತಾರೆ ಎಂದು ಭಾವಿಸಿ ಯಾವಾಗಲೂ ವಿನ್ಯಾಸಗೊಳಿಸಿ.

• ಅಸಮಂಜಸವಾದ ಲೇಔಟ್‌ಗಳನ್ನು (inconsistent layouts) ನಿರೀಕ್ಷಿಸಿ ಪ್ರತಿಯೊಂದು host ಕೂಡ spec ಅನ್ನು ವಿಭಿನ್ನವಾಗಿ ಅನುಷ್ಠಾನಗೊಳಿಸುತ್ತದೆ. ChatGPT ಅಗಲವಾಗಿ ಪ್ರದರ್ಶಿಸುತ್ತದೆ. Claude ಕಿರಿದಾಗಿ ಪ್ರದರ್ಶಿಸುತ್ತದೆ. ಮೊಬೈಲ್‌ನಲ್ಲಿ ಇದು ಮತ್ತಷ್ಟು ಭಿನ್ನವಾಗಿರುತ್ತದೆ. ಮೊದಲಿನಿಂದම ಕಿರಿದಾದ ಅಗಲಗಳಲ್ಲಿ ಹೊಂದಿಕೊಳ್ಳುವ (reflow) ಲೇಔಟ್‌ಗಳನ್ನು ವಿನ್ಯಾಸಗೊಳಿಸಿ.

• Dev loop ನಿಧಾನವಾಗಿದೆ ಇನ್ನೂ ಯಾವುದೇ ಪ್ರಮಾಣಿತ ಪರೀಕ್ಷಾ ಪರಿಕರ (standard testing tool) ಇಲ್ಲ. ನೀವು ಪ್ರತಿಯೊಂದು ಕ್ಲೈಂಟ್‌ನಲ್ಲಿ ಇದನ್ನು ಮ್ಯಾನುಯಲ್ ಆಗಿ build ಮಾಡಿ, ಇನ್‌ಸ್ಟಾಲ್ ಮಾಡಿ ಮತ್ತು ಪರಿಶೀಲಿಸಬೇಕು. ಇದು ಸಾಮಾನ್ಯ ಫ್ರಂಟ್‌ಎಂಡ್ ಕೆಲಸಕ್ಕೆ ಹೋಲಿಸಿದರೆ ನಿಧಾನವೆನಿಸುತ್ತದೆ.

• ಆ್ಯಪ್‌ನಲ್ಲಿ ರಹಸ್ಯಗಳನ್ನು (secrets) ಸಂಗ್ರಹಿಸಬೇಡಿ Apps sandboxed iframe ನಲ್ಲಿ ಚಲಿಸುತ್ತವೆ. Host ವಿಷಯವನ್ನು ನೋಡಬಹುದು. ಫಾರ್ಮ್ ಫೀಲ್ಡ್‌ಗಳಲ್ಲಿ ಎಂದಿಗೂ API keys ಅಥವಾ OAuth tokens ಇಡಬೇಡಿ. ನಿಮಗೆ ಸೂಕ್ಷ್ಮ ಡೇಟಾ (sensitive data) ಬೇಕಾದಲ್ಲಿ ಪ್ರತ್ಯೇಕ ಸುರಕ್ಷಿತ ಫಾರ್ಮ್ ಬಳಸಿ.

ನೀವು ಈಗಲೇ ಪ್ರಾರಂಭಿಸುತ್ತಿದ್ದರೆ:

  • ನಿಮ್ಮ UI ಅನ್ನು ನಿಮ್ಮ ಸರ್ವರ್‌ನ ಒಳಗೇ ಬಂಡಲ್ ಮಾಡಿ.
  • Multi-page Vite setup ಬಳಸಿ.
  • ನಿಮ್ಮ ಅಸ್ತಿತ್ವದಲ್ಲಿರುವ design system ಅನ್ನು ನೇರವಾಗಿ ಇಂಪೋರ್ಟ್ ಮಾಡಿ.

MCP Apps ಇನ್ನೂ ಆರಂಭಿಕ ಹಂತದಲ್ಲಿದೆ ಮತ್ತು spec ಬದಲಾಗುತ್ತಾ ಸಾಗುತ್ತಿದೆ. ಪರಿಕರಗಳು (tooling) ಅಲ್ಪವಾಗಿದ್ದರೂ, ಅವುಗಳನ್ನು ಬಿಡುಗಡೆ ಮಾಡುವುದು ಯೋಗ್ಯವಾಗಿದೆ.

Source: https://dev.to/arcade/lessons-from-building-20-mcp-apps-in-2-days-1f98

Optional learning community: https://t.me/GyaanSetuAi