Framer X is quite different from legacy Framer at first sight. But it builds on everything that made the original Framer great with an improved approach, and solving some long standing problems like package collaboration.
The biggest surface differences are:
Everything is React and ES6 (versus CoffeeScript and plain Framer)
There is no more built-in code editor inside Framer X.
There are some visual tools that write code for you (link, scroll, page).
We strongly believe Framer X is better than legacy Framer from a prototyper programming perspective. It will allow you to build both very small high fidelity throw away prototypes all the way to production ready complex projects, if you like. The new declarative programming model with components will help you structure and organize your projects, make them easier to reason about for yourself and others, yet is completely optional if you have another preferred way of working.
These are some things to explore if you are coming from Framer Studio. Make sure you setup VSCode for external editing.
Create a single code component and modify the html and css. Study the
propertyControl and how you can add properties interface to components.
Use a design component with custom properties from the canvas in a code component and use it in a loop.
Use a code component on the canvas and use a code override with state and an event handler modifying the state.
A set of agreements to describe components.
A structured, declarative way to reason about your interface.
These ideas are the things that make React great (and so popular). They're not new and will be around for a long time, independent of the implementations of the ideas (the specific framework). So just think of React as a set of great ideas to build interfaces.
Additional great reasons to build on React are that it's extremely easy to learn, if you know basic web development (html and css) it's enough to build your own component. Plus, if you happen to work at a place that uses React in production too, there is a chance you can efficiently share code.
Legacy Framer projects had no structure by default and that made it very hard to re-use, compose or share parts of your interface, within and between projects.
Legacy Framer was mostly imperative, while Framer X is fully declarative. These words entail a philosophical different way of describing a change in the world. I'll try to explain.
Imperative is like a cooking recipe. It describes a set of steps and ingredients that, if followed correctly, lead to a great dish at the end. It may allow for some variation, but it's important to follow all the steps closely, or the end state might be unexpected.
Declarative focuses purely on describing the dish and leaves it up to the maker to figure out how to get there, as long as it ends up in a certain way.
Computers are really great at figuring out steps between different states. So describing your interfaces declaratively and leaving the steps up to the computer is a great idea for building interfaces. This way you can just describe your states (loading, error, login screen), under which conditions to show them, and let the computer figure out the rest.