The Framer book explains everything about using code when building sites or prototypes in Framer. It shows you how to create different kinds of animations, has all the details about overrides, and explains how to create your own code components. This Framer course also doubles as an extended manual that you’ll often refer to.
Last update: July 29, 2022
200+ example prototypes made with code
100+ Motion projects in CodeSandbox
100,000+ words of detailed explanations
The Framer book has always been my go-to resource when making something in Framer. It’s incredible how well written the book is.
The Framer book is well laid out and easy to understand, especially from a developer standpoint.
With the Framer book, I have a reliable source which is incredibly well made. Structure and writing are just excellent.
Seriously concise info about Framer that covers most of what you want to learn. Tes has a great way of explaining a broad range of concepts from simple to more complex.
The Framer book really is THE Framer book to depend on and an absolute gem of a find. It’s clear a ton of craftsmanship went into creating design exemplars and intuitive written and visual guides as well as thorough technical documentation with concise richly-annotated code snippets and even interactive “sandboxes” to try things out myself. The designer half of my brain loves that I can steal pre-built building blocks from The Framer book and don’t NEED to write my own code to create advanced prototypes while the developer half loves that I CAN write my own code and refer back to the high-quality technical guides that seamlessly mesh theory and practice. If you’re wondering whether The Framer book is built for designers or developers rest assured the answer is a resounding “Yes!”
This clear and example-rich book gave me a deeper understanding of Framer and React. As a designer, I nowadays enjoy opening up the Code tab to design by code.
Framerbook is the hidden Framer manual I always turn to. It keeps up to date with Framer’s changes and is extremely well written.
Tes’ book is my go-to resource for everything to do with Framer. The detailed explanations with accompanying code examples really helps you get to grips with Framer and React. Highly recommended!
Packages
-
The Framer book$70.00 / year -
The Framer book for Enterprise$30.00 per member / year -
The Framer book for Teams$40.00 per member / year
Table of contents
- Framer for Developers
- Code Overrides
- Code Components
- Animation
- Animation Free
- The Animate Property Free
- The Transition Property Free
- ‘While’ Animations and Initial Free
- Variants
- Hooks
- The useState() Hook
- Animate Presence Updated
- The useCycle() Hook
- The useAnimation() Hook
- Keyframes
- Animatable Properties
- Animation Types
- Animating to a Scroll Position
- API Overview Free
- Example Animations Free
- Framer Motion
- Smart Code Components
- Dragging
New & Updated : changes in the last 30 days
Upcoming 👨💻:
- A few remaining Framer Sites updates:
- Overriding Code Components — Because the current examples use components from public (legacy) packages.
- Importing Other Layers, Components, and Packages — I will add an example of how to wrap components from an existing design system.
- New section: Tracking gestures with MotionValues
- A global, introductory ‘Framer’s Toolbox’ section
Tes Mat
I’m a web and iOS developer who was looking for the best prototyping tool. I tried eight of them, liked Framer (Classic) the most, and wrote an extended manual about it. Then, when the current version of Framer launched, I wrote this manual. I’ve also taught Framer workshops and courses at Projector in Kyiv.