In the Handshake URL, you will notice a randomly generated string after the @ symbol. This string represents a specific version of your component. If you make a change to your component, that version string will change. In that way, you can ensure that you are working with a specific version of the component, and only when you are ready to update, you can grab the new URL. If on the other hand you want your page to always use the latest version of a component, simply remove the part starting with the @ symbol.
In the above example, you will notice that some of the component properties are dynamically set in code. That is because we have defined them as dynamic in Framer. For instance, the CTA button's label can be set via the buttonText property of the component. To achieve this behavior, select your component in Framer, and in the property sidebar, make the desired property dynamic by hitting the + button next to the property, then Create, and give it an identifier.
Here is a video walking you through the steps to set up Framer with Motif: