Webflower로 사용하기 시작하는 데 필요한 자동화 도구 및 확장

Nov 26 2022
Webflow는 이미 코드 없는 도구로서의 기능을 가지고 있지만 사이트의 성능과 기능을 개선하기 위해 더 많은 도움의 손길을 추가할 수 있다면 얼마나 환상적일지 상상해 보십시오. Webflow 통합은 막대한 가치를 추가하고 웹 사이트에 대한 모든 종류의 기능을 잠금 해제합니다.

Webflow는 이미 코드 없는 도구로서의 기능을 가지고 있지만 사이트의 성능과 기능을 개선하기 위해 더 많은 도움의 손길을 추가할 수 있다면 얼마나 환상적일지 상상해 보십시오. Webflow 통합은 막대한 가치를 추가하고 웹 사이트에 대한 모든 종류의 기능을 잠금 해제합니다.

Webflow는 전문적이고 복잡한 프런트엔드를 빠르고 쉽게 구축할 수 있는 기능과 활기찬 커뮤니티로 인해 전문가들에게 사랑받고 있습니다.

수년에 걸쳐 많은 Webflowers는 코드 없는 도구의 한계를 확장했으며 이 코드 없는 도구로 다양한 도구와 제품을 만들었습니다. 이는 확장 및 자동화 도구를 통해서만 가능했습니다.

이 기사에서는 Webflow의 초보자로서 익숙해지는 데 필요한 몇 가지 기능 확장 및 도구를 정리했습니다.

1. 핀스위트

Finsweet은 가장 유명한 Webflow 에이전시로 Webflow 프로젝트에 기능을 추가할 수 있는 다양한 솔루션을 제공합니다. 예를 들어 CMS에 연결된 필터링 시스템을 추가하거나 CMS 항목이 있는 슬라이더를 만들거나 미리 설정된 이름 지정 가이드를 사용하여 사이트 구축 및 성능을 높일 수 있습니다. 요컨대, Finsweet 제품을 사용하여 Webflow에서 "잠금 해제"할 수 있는 많은 기능이 있습니다.

내가 정기적으로 사용하는 F'insweet 제품:

나. Finsweet 클라이언트 - 첫 번째

Webflow에서 Finsweet 클라이언트를 사용하면 잘 구성된 웹사이트를 만드는 데 도움이 됩니다.
Client'First는 웹사이트 구축을 지원하고 프로젝트의 일관성을 유지하는 데 도움이 되는 일련의 지침과 전략입니다.
여기에서 자세히 알아볼 수 있습니다.
https://www.finsweet.com/client-first/

ii. 핀스위트 익스텐션.

F'insweet은 Webflow 개발을 향상시키기 위해 무료 확장 프로그램을 만들었습니다. 프로젝트에 적용하면 광범위한 가능성을 제공하는 툴킷을 갖추게 됩니다.
이 확장 프로그램은 다음과 같은 강력한 기능을 제공합니다.

  • CSS 스타일 정렬, 편집 및 제거
  • 상호 작용, 기호 및 색상 견본 재정렬
  • 대량 301 리디렉션 업로드
  • 중단점 강조 표시 및 제거
  • 그리고 훨씬 더.

    여기에서 확장 프로그램을 설치할 수 있습니다(https://chrome.google.com/webstore/detail/finsweet-extension-for-we/mjfibgdpclkaemogkfadpbdfoinnejep)

Relume 라이브러리 는 사이트를 더 빠르게 구축하는 데 도움이 되는 Webflow 구성 요소 라이브러리입니다(몇 일이 아닌 몇 시간 만에).

영웅 섹션, 바닥글, 블로그 게시물, CTA 및 더 복잡한 레이아웃과 같은 구성 요소는 이미 처리된 모든 중단점 빌드와 함께 이 라이브러리에서 사용할 수 있습니다.
이 라이브러리는 Webflow에서 웹사이트를 디자인하고 구축하는 프로세스를 간소화하여 클라이언트의 마감일을 맞추기 위해 만들어졌습니다 :)

3. 재피어

간단히 말해 Zapier 는 여러 앱을 연결하고 반복적인 작업을 수행하는 자동화 플랫폼입니다. Zapier는 3,000개 이상의 앱 및 소프트웨어 플랫폼과 함께 작동하므로 코딩 노력을 낭비할 필요가 없는 모든 종류의 일상적이고 일상적이며 시간 소모적인 작업을 자동화하는 "zaps"로 알려진 워크플로를 생성할 수 있습니다.

Zapier가 자동화할 수 없는 것은 거의 없습니다. 양식 제출 여부 Webflow CMS로 전송 또는 Google 시트에서 즉석에서 정보를 가져와 Webflow CMS에 데이터를 입력한 다음 손가락 하나 까딱하지 않고도 해당 데이터를 게시할 수 있습니다. Zapier의 힘은 실재합니다!
Zapier를 사용하면 다음을 수행할 수 있습니다.

  • Webflow 데이터를 Google 시트로 보내기
  • Webflow 데이터를 Mailchimp로 보내기
  • Webflow 양식이 제출되면 Gmail에서 이메일 보내기
  • 받은 데이터에서 CMS 항목을 만듭니다.

Zapier에서 지원하지 않는 앱(예: 자체 웹 앱)을 사용하여 고급 자동화가 필요한 경우 Zapier를 사용하면 이러한 사용 사례에 대한 사용자 지정 웹후크를 만들 수 있습니다.

4. 에어테이블 + Whalesync

에어테이블 은 모든 노코드에서 가장 강력한 조합 중 하나입니다. Airtable과 Webflow를 통합하여 구인 게시판, 자동 SEO 페이지, 리소스 목록 등을 만들 수 있습니다.

Airtable에서 Webflow로 데이터를 동기화하는 가장 간단한 방법은 Whalesync를 사용하는 것 입니다. 실시간 양방향 동기화를 생성하려면 Webflow CMS에서 필드를 매핑하기만 하면 됩니다. 텍스트, 서식 있는 텍스트, 이미지, 날짜, 선택 및 다중 참조 필드가 모두 기본적으로 지원됩니다. 한 줄의 코드를 생성하지 않고도 Whalesync는 모든 앱에서 실시간 양방향 데이터 동기화를 제공합니다.

5. 아웃세타

Outsetta 는 사용자 계정을 활성화하고 회원 사이트를 만드는 가장 쉬운 방법입니다.

사용자 구독을 관리하려는 경우 Webflow에서 사용자 계정을 활성화하고 구독을 기반으로 구성원을 위한 콘텐츠를 게이트하거나 사용자가 선택하고 가입할 수 있는 여러 계획을 만듭니다.
또한 다음과 같은 경우에도 도움이 됩니다.

  • CRM(Customer Relationship Management), 고객과의 커뮤니케이션 전반을 한 곳에서 관리할 수 있습니다.
  • 뉴스레터에 거래 이메일 작성

Flowbase 는 Webflow 및 Figma를 위해 아름답게 디자인되고 전문적으로 구축된 구성 요소가 포함된 웹 사이트 구성 요소 라이브러리입니다.

기본적으로 미리 만들어진 구성 요소를 가져올 수 있으므로 섹션과 타자 및 원하는 모든 것을 구성 요소 라이브러리에서 프로젝트로 직접 복사하여 붙여넣을 수 있습니다.

사람들이 내 문서 릴리스에 대한 알림을 받을 수 있는 메일을 보낼 수 있는 섹션을 추가하고 싶다고 가정해 보겠습니다. 구성 요소를 보고 복사하여 내 웹 사이트에 붙여넣기만 하면 됩니다(Relume 라이브러리와 약간 유사함).

7. 와이즈드

Wized 를 사용하면 Webflow 프로젝트 위에 100% 맞춤형 웹 애플리케이션을 구축할 수 있습니다.

Wized는 프런트엔드로 Webflow의 기능을 확장하고 별도의 애플리케이션 논리 및 기능을 사용하여 Webflow 프런트엔드에 웹 애플리케이션을 구축할 수 있도록 합니다. 동시에 Airtable 또는 API의 데이터를 통합할 수 있습니다.

Webflow의 기능이 웹 애플리케이션의 기본 요구 사항을 충족하도록 확장되지 않은 이유는 오랫동안 저를 놀라게 했습니다. 여기서 Wized가 등장합니다.

Wized는 궁극적으로 Webflow를 기반으로 합니다. Webflow와 유사한 인터페이스를 통해 네트워크 요청을 통합하고 데이터를 개별 요소에 시각적으로 연결할 수 있습니다. 전체 프로세스는 시각적으로 이루어지며 코드를 작성할 필요가 없습니다.

Wized는 사용하기 쉽지만 복잡한 Airtable 통합을 제공합니다. Wized는 간단한 스토리지에서 복잡한 쿼리에 이르기까지 Airtable을 프로젝트에 통합하기 위한 모든 옵션을 제공합니다.

결론.

위에 나열된 도구 및 확장 기능은 어떤 식으로든 내 빌드 프로세스를 지원하고 Webflow의 기능을 향상시켰습니다.
Webflow가 자체적으로 강력하더라도 이러한 플러그인과 도구는 사이트가 성장하고 더 많은 방문자를 유치하는 데 도움이 됩니다.

이것은 정해진 규칙이 아니라 제 제안일 뿐이라는 점에 유의하십시오.
도구 및 도구를 효과적으로 사용하는 방법에 대해 자세히 알아보려면 해당 웹 사이트를 방문하십시오.