How to build Framer Custom Code Components
👉 Spreadsheet calculator: https://docs.google.com/spreadsheets/...
🧮 Live calculator: https://sergeichyrkov.com/blog/resour...
💌 Need consultation on Framer, MCP or Cursor? Learn more: https://sergeichyrkov.com/learn
In this video, I'll demonstrate how to create a fully functional Framer calculator by leveraging a spreadsheet like "Google sheets", combined with the power of "Chat GPT" and "Cursor AI". This comprehensive "tool" simplifies the process of building interactive elements for your "web design" projects. Learn how to integrate a "calculator using javascript" seamlessly into your Framer site, making it easy to follow along for viewers.
______________________________
Check out my links ⬇️
▸ My website — https://sergeichyrkov.com
▸ My studio — https://chyrkov.studio
▸ My curated resources library — https://designsweets.co
▸ Twitter — / sergeichyrkov
▸ Instagram — / chyrkov
▸ Behance — https://www.behance.net/chyrkov
▸ Linkedin — / sergeichyrkov
______________________________
Useful stuff:
👉 Build websites in minutes with Framer — https://framer.link/chyrkov
👉 Record your screen like a Pro — https://screenstudio.lemonsqueezy.com...
👉 Best music for your videos (get 30 days for free) — https://www.epidemicsound.com/referra...
______________________________
📝 Chapters:
0:00 — introduction
0:32 — spreadsheet structure explained
5:17 — Chat GPT prompt preparation explained
11:18 — Create a code component in Cursor
13:18 — Transferring component to Framer
15:43 — check the results
18:18 — apply fixes in Cursor
20:13 — final results
______________________________
😍 Monetarily Supporting The Channel:
If you like what I do and wish to support the channel monetarily, you can donate me with some coffee here: https://www.buymeacoffee.com/sergeich...
This is appreciated and helps the channel, but please don't feel that it is necessary to enjoy my content.
______________________________
📃 Disclaimer:
Some of the links in my video descriptions are affiliate links, which means at no extra cost to you, I will make a small commission if you click them and make a qualifying purchase.
______________________________
#framer #framertutorial #cursor #webdesign #ai