This page explains how to get started with your development workflow.
You probably develop on
localhost or use an online editor like
CodePen. Yay, we made this possible.
In the previous section you have learned how to set up and configure a project. We have two mechanisms for associating your website with your project:
- For evaluation and development, you add an evaluation key to your project as
metatag, which you collect from your project's evaluation tab. If we find the tag on your page, we load the project's configuration and display embeds as configured. This works from everywhere, but we will limit social distribution when website items are viewed.
- For serving in production, you can associate one or more domains (origins) with your project. If we see you website origin, we load the associated project to display the embed. This will not work for development, but gives you all functionalities.
When you finish developing, just leave your evaluation key on your website and rotate it on the development platform. This invalidates the key. Next time you make changes, create a new evaluation key and replace it on your website. Even if you should forget to invalidate your key, it will expire within a few days (unless you have set a longer expiration, which we do not recommend except for specific cases where your project doesn't have an origin, such as for a demo on CodePen). If we find a valid key and an origin on a website, we will use the origin and ignore the key.
- Create and configure your project.
- Use the evaluation key to develop your page on
localhost. You can preview changes almost immediately after you make adjustments on the development platform or in your code. If you make changes on the development platform, wait a few seconds for changes to be distributed throughout all datacenters and then reload your page. Changes you make in code are available as soon as you reload.
- When done, assign your project a verified domain.
- Rotate your evaluation key to invalidate it.
When there are changes:
- Rotate your evaluation key and copy it to your clipboard.
- Swap the key in the next version of your code.
- Make your changes. With your evaluation key, you can preview these immediately, while page visitors are still served the previous version.
- When done, rotate the evaluation key to invalidate it.
[Restart serving]so your website visitors can see your changes as well.