스마트 컴포넌트 X Code Override

안녕하세요, 김지아님. Override 사용에 어려움이 있으신군요.다른 문의에 대한 답변을 보셨다면 아시겠지만, Framer에서 더 이상 Override, Data 등의 Legacy 코드들의 지원을 하고 있지 않습니다. 이를 대체하는 코드인 HOC (Higher-Order Component)와 createStore등의 자료도 한국에서는 찾기 어려우셨을 거에요.현재 버전에서 활용 가능한 코드는 Framer 공식 API 문서인 https://www.framer.com/motion/ (무료), 추천 사이트에서 소개드린 https://framerbook.com/x/toc/ (유료) 등의 사이트에서 확인이 가능해요. 혹은 Framer의 커뮤니티인 https://discord.com/invite/framer 에서도 정보를 얻을 수 있습니다. :)저도 강의를 드리려 노력하지만 본업으로 인해 제작이 쉽지는 않네요. 빠른 시일내에 새로운 강의로 찾아뵙도록 하겠습니다.강의 봐주셔서 감사합니다!

스크롤 기능 사라졌나요?

안녕하세요 dkwls2364님, 새로운 framer UI에 대해 문의주신걸까요?연달아 주신 질문이 많아, 해당 답변으로 답변드리도록 할게요. Q 프레이머 레이아웃 변경으로 / 스크롤 , 페이지 기능을 못찾겠습니다.canvas 화면으로 들어간 후, insert 버튼을 누르면 스크롤을 확인할 수 있을거에요(사진)(사진)Q 저는 모바일 사이즈를 기본으로 시작하고 싶은데, 변경할 수 있는 방법이 있을까요?캔버스 화면에서 F버튼(프레임)을 선택하면 우측에 모바일 화면 스크린사이즈가 보입니다!(사진)Q 아이폰 모델에 담긴 화면을 보고 싶어요.신규 버전의 Framer에서는 해당 기능을 지원하지 않습니다.ㅠㅠQ 스크린 크기 늘려야 스크롤이 생기네요web 버전에서는 스크린을 늘리면 스크롤이, canvas에서는 스크롤 컴포넌트를 사용하면 스크롤 이 생깁니다.프레이머가 과거 프로토타입 위주의 제작 화면을 지원하지 않기 시작하면서, 현 강의와 현재 프레이머의 화면이 너무 달라 불편하셨을텐데요. 빠른 시일내에 새로운 강의를 통해 찾아뵙도록 하겠습니다.강의봐주셔서 감사합니다. :D

프레이머 레이아웃 변경

안녕하세요, 송해석님. 새로운 Framer UI에 대해 문의주신걸까요?작년 5월에 프레이머는 디자인 프로토타이핑 툴에서 웹 퍼블리싱 툴로 업데이트를 진행했습니다. 따라서 UI에도 큰 변화가 있었는데요. 순서대로 설명드리자면,web - 온라인으로 화면을 배포하는 공간입니다cms - 블로그와 같은 화면을 제작할 때 사용합니다.canvas - 프로토타입을 제작하는 공간입니다!강의와 현 프로덕트 화면이 크게 차이가 나 혼란스러웠을텐데요, 빠른 시일내에 새로운 강의를 통해 찾아뵙도록 하겠습니다.강의봐주셔서 감사합니다. :D

Frame에 백그라운드이미지와 텍스트를 함께 설정하고 싶습니다.

안녕하세요, seonjukim님. 백그라운드 이미지 설정에 문제가 있으시군요. 에서는 이미지를 로드할 경우, 텍스트를 덮는 형태로 구현됩니다. 따라서 아래와 같이 2개의 을 구현하게 되면 이미지 위로 텍스트가 로드됩니다.import { Frame } from "framer" export default function MyComponent(props) { return ( {props.text} ) } 다만, 위와 같은 형태로 마크업을 하게되면 디자인이 복잡해질수록 코드가 배로 복잡해집니다. 프레이머의 최신 라이브러리인 를 사용하면 아래와 같은 문법으로 작성이 가능해요.import { motion } from "framer-motion" export default function MyComponent(props) { return ( {props.text} ) }강의를 촬영한 것도 1년 이상 지나 그동안 프레이머가 많이 업데이트가 되었는데요. 빠른 시일 내에 새로운 버전의 프레이머 강의를 공유드리도록 할게요.강의 봐주셔서 감사합니다. :)

질문이 있어요

안녕하세요 연남동이재용님, 새로운 프로젝트 생성에 어려움이 있군요.금번 Site 버전 업데이트로 인해 프레이머는 Web / CMS / Canvas라는 세 공간을 활용하도록 안내하고 있습니다. 기존 강의에서 설명한 부분은 Canvas 공간을 이용하면 되지만, 강의 중 일부 코드가 작동하지 않는 이슈로 인해 공지사항의 안내에 적힌것과 같이 http://framer.com/projects/new 링크를 통해 접속을 요청드립니다.추가로, Site 프로젝트를 열었을 경우 Canvas 외 공간 및 primary를 삭제하는 방법은 제공하고 있지 않습니다. 불편하시겠지만 원활한 강의 진행을 위해 위와 같은 방법을 이용 부탁드립니다.강의 봐주셔서 감사합니다!