Vigma RN: Figma, but with real-time React Native codegen

Please visit https://docs.vigma.dev for the latest information!

⚡ Center a  <View />  with a mouse click, both horizontally and vertically.

⚡ Edit existing DUMB components visually

Note: default Props should be given where required

Frequently Asked Questions

• Q: How do I use Vigma RN?

• A: Open a .tsx (typescript) file that has a dumb component. Click the blue cursor icon("edit in Vigma") in the editor menu area.
  
  

• Q: Does Vigma RN support react.js?

• A: No, at least not yet.
  
  

• Q: Why react-native, not react.js?

• A: Mainly for three reasons: (1) It's cross-platform. (2) The components are better modularized than react.js. (3) Usually, the screen size is small, so it fits well as a VS-Code extension.
  
  

• Q: Does Vigma RN support XXX?

• A:

  • tailwind(nativewind): No. At least not yet. But we're open to discussion. The whole point of Vigma RN is not having to write code about styling. Do you guys need tailwind? If so, why?
  • styled-components: For now, we don't have a plan to support.
    
    

Contacts

If you have any questions or suggestions, please feel free to contact us.

• Email: admin@n3rds.io
  
  

Known Issues

• .webm files are NOT supported(It's simply NOT displayed), as VSCode does not ship with ffmpeg in its electon build. (see mjbvz's comments on https://github.com/microsoft/vscode/issues/54097)
• Class-components are NOT supported. (You can call a class-component inside your functional component, but you can't edit a class-component itself with Vigma RN)