노코드(No-Code)란?
코드를 몰라도 만들 수 있는 개발
프로토타입 / MVP 제작
- 코드 없이도 UI 목업을 만들고, 클릭 가능한 프로토타입 수준 웹사이트로 시연 가능
- 예: “우리 서비스 랜딩페이지”를 Framer로 만들어 A/B 테스트를 돌리거나, 가짜 가입 흐름을 만들어 사용자 반응을 미리 볼 수 있음
- 개발 리소스 절감: 기초 설계 단계에서 UI와 UX를 확정해두고, 나중에 실제 개발 시 큰 틀을 유지 가능
간단 개인 블로그 / 포트폴리오 페이지
- 개인 블로그 / 포트폴리오를 쉽게, 단기간 내 제작 가능
- 개발자 도움 없이도 구축 및 유지보수가 가능
* framer에서 단축키 i 누르면 insert 바로 들어갈 수 있음
( 삽입 insert의 i )
CMS -> 다른페이지로 이동 (CMS를 관리하는 페이지로 화면이 전환이 된다)
플러그인은 기본 프로그램(앱)에 '연동'하여 특정 기능을 확장하거나 추가해 주는 소프트웨어
- 기능 확장: 프로그램의 원래 기능만으로는 부족한 부분을 타사 서비스나 추가 모듈과 연동하여 채워줍니다.
* 원하는 기능을 찾고싶을때
맥 = Cmd(Command) + K
윈도우 = Ctrl + K
shift 누르면 -> frame 함께 선택가능
Frame 생성 및 조작법
- F 키 → Frame 도구가 활성화
- 부모안에 자식으로 넣고싶으면 그냥 냅다 F키 / 자식 아니고 따로따로 독립적인 요소로 하고싶으면 space 누른채로 F키 (겹쳐지더라도 따로따로 독립적으로 생성됨)
- 드래그로 생성 → Shift로 정사각형, Alt로 중심에서 확대
- shift로 여러 요소 선택 후 Ctrl (맥 -> Cmd) + Enter → Wrap with Frame(묶기)
- 부모 Frame 삭제: Ctrl (맥 -> Cmd) + Delete (자식은 남김) -> 자식은 생존시킨채 부모 frame만 삭제하고싶을 경우
- Z 키 → Zoom 도구 활성화
- Option + 클릭 → Zoom Out
- Shift + 1 → 전체 보기 (Zoom to Fit)
- Shift + 2 → 선택 요소 중심 보기 (Zoom to Selection)
- Shift + 3 → 100% 보기 (Zoom to 100%)
- Space 누른 채 드래그 → 팬 이동
대형 프로젝트에서는 줌/팬 조작이 핵심 생산성 도구
| 위치 속성 | 설명 |
| Absolute | 자유롭게 배치 가능. 기본값. 다른 요소의 흐름에 영향 없음. |
| Relative | Stack이나 Grid 내부에서 흐름을 따라 배치됨. Stack의 기본 위치 속성. |
| Fixed | 뷰포트 기준으로 고정됨 (스크롤 무시). |
| Sticky | 뷰포트 상단에 닿으면 Fixed로 바뀌는 하이브리드형. |
* Stack으로 만들 수 있는 것
- 내비게이션 바 (가로 Stack)
- 카드 리스트 (세로 Stack)
- 버튼 내부 텍스트 정렬
- 콘텐츠 섹션 사이의 일관된 간격 유지
1퍼포는 온라인 마케팅 분야에서 '퍼포먼스 마케팅(Performance Marketing)'을 줄여 부르는 말입니다. 광고가 단순히 노출되는 것에 그치지 않고, 고객의 '클릭', '구매', '가입' 등 측정 가능한 행동(성과)을 이끌어내는 데 집중하는 마케팅 기법