Getting everything set up and connected to start using the Supernova developer platform.
Download Supernova VS Code Extension
Supernova integrates tightly with your Microsoft VS Code environment and we have published an extension that you can download right now to get started.
Navigate to the VS Code extension marketplace
Search for Supernova
Install the extension
Once you install the extension, you will see its icon pop up on the left side - that way, you can always access it anytime you need to generate code out of your design system.
Supernova extension showing itself right after installing
Currently, only VS Code is supported. However, we strongly recommend using VS Code for the best experience possible. Join our community Discord to get more information about upcoming releases of Supernova extension for more platforms!
Obtain Your Developer Key
The extension must be authorized to communicate with your design systems on your behalf. For this reason, you must generate a persistent developer key on our cloud before you start developing. This key allows you to access any design systems within workspaces of which you are a member.
Make sure you have a Supernova user account created first
Navigate to Supernova Cloud > Your personal profile (top right corner) > Authentication
Generate the authentication token and safely store it so you don't lose it
Providing a custom name will help you differentiate between different tokens easily
Once you confirm and create the token, you will only get one chance to see the key. If you lose the token, you will have to generate it again.
Login in VS Code
Once you have obtained your key, you must authorize the extension itself. Navigate to the extension and switch to the Supernova panel. You will see only one option (Login). Click the Login button and copy-paste the key into the text box. This will log you in and also securely store your key locally so your developer session persists as you are working.
Login by copy-pasting the developer key into the provided input field
At this point, you should be able to see the Supernova panel with different options, like the ability to select a default exporter, the ability to choose from your design systems, etc. You are now ready to start developing with Supernova!
Your panel content will warry depending on if you already selected design system and so on