방법: 앱을 Zapier와 연동하기

게시일 5. 8월 2022 작성자 Jan Bunk

Zapier 자동화가 연결된 워크플로 단계를 따라 이벤트를 앱 작업으로 전달하는 모습이에요.

앱 사용자에게 푸시 알림을 자동으로 보내고 싶지만 코딩할 줄 몰라 저희 API를 사용할 수 없었던 적이 있나요? 이제는 문제없어요! app-control-panel.com을 자동화 플랫폼인 Zapier와 통합했어요. Zapier를 사용하면 코드를 직접 작성하지 않고도 수천 개의 서비스를 app-control-panel.com API와 연결할 수 있어요.

사용해 볼 준비가 되셨나요? 이 통합 기능은 아직 베타 버전이므로 다음 링크를 클릭해 접근 권한을 받아야 해요. app-control-panel.com Zapier 통합 기능에 접근하기

연결 예시

app-control-panel.com 블로그에 새 글을 게시할 때 자동으로 알림을 보내도록 Zap을 설정했어요. 이를 위해 아래 스크린샷과 같이 "RSS by Zapier" 트리거를 사용했어요.

Zapier 인터페이스 스크린샷

WordPress 통합

웹사이트에 RSS 피드가 없더라도 같은 목적에 사용할 수 있는 다른 통합 기능이 많이 있어요. 예를 들어 WordPress 통합은 "새 게시물" 트리거를 제공해요. 이 트리거를 사용해 모든 사용자에게 알림을 보내거나, 더 고급 기능인 주제별 알림을 설정할 수 있어요. 주제별 알림을 이용하면 사용자가 웹사이트의 카테고리를 구독하고, 구독한 카테고리에 새 게시물이 게시될 때 알림을 받을 수 있어요. 이를 위한 Zapier 구성은 다음과 같아요.

  • Trigger App: Wordpress
  • Event: New Post
  • Trigger:
    • Post Status: Published
    • Post Type: Posts
  • Action App: app-control-panel.com
  • Event: Send Topic Push Notification
  • Action Setup:
    • Topic: Terms Slug (글의 카테고리예요)
    • Push Notification Title: Title Rendered
    • URL to Open on Click: Link
    • 다른 필드는 비워 두거나 원하는 대로 입력할 수 있어요.

그런 다음 사용자가 주제를 구독하거나 구독 취소할 수 있도록 웹사이트에 다음 스크립트와 버튼을 추가하세요.

코드 보기이 코드는 기본적으로 현재 페이지의 카테고리를 찾고, 사용자가 버튼을 클릭하면 앱에 해당 카테고리를 구독하거나 구독 취소하도록 지시해요.

<button type="button" id="subscribe-category-button" style="display: none; color: white;" onclick="toggleSubscriptionStatus()"></button>
<script src="https://app-control-panel.com/static/js/app-helper.js"></script>
<script>
        executeWhenAppReady(async () => {
            document.getElementById("subscribe-category-button").style.display = "block";
            updateButton(await getSubscriptionStatus());
        });

        function updateButton(isSubscribed) {
            var subscribeButton = document.getElementById("subscribe-category-button");
            subscribeButton.innerHTML = isSubscribed ? "Unsubscribe" : "Subscribe";
            subscribeButton.style.backgroundColor = isSubscribed ? "red" : "green";
        }

        async function getSubscriptionStatus() {
            var subscribedTopics = (await getSubscribedNotificationTopics())["topics"];

            return subscribedTopics.includes(getTopicName());
        }

        function getTopicName() {
            for (var className of document.querySelector("article.post").classList) {
                if (className.startsWith("category-")) {
                    return className.substring(9);
                }
            }
        }

        async function toggleSubscriptionStatus() {
            try {
                var subscriptionStatus = await getSubscriptionStatus()
                setNotificationTopicSubscriptionStatus(!subscriptionStatus, getTopicName());
                updateButton(!subscriptionStatus);
            } catch (e) {
                console.log(e);
            }
        }
</script>
        

다른 아이디어

푸시 알림을 자동화할 수 있는 몇 가지 아이디어를 더 소개해 드릴게요.

  • "Schedule by Zapier" 트리거로 매주 같은 알림을 예약해요.
  • Google Calendar의 이벤트가 시작되기 전에 푸시 알림을 보내요.
  • Twitter의 "User Tweet" 트리거로 트윗도 푸시 알림으로 보내요.
  • 소셜 미디어 활동을 앱 사용자와 공유하는 방법은 이 외에도 많아요. 다음과 같은 상황에서 알림을 보내 보세요.
    • ... YouTube 동영상을 업로드할 때
    • ... Twitch에서 라이브 방송을 시작할 때
    • ... Instagram에 게시물을 올릴 때

Zapier와 app-control-panel.com을 함께 활용하는 멋진 방법을 찾으셨나요? 알려 주시면 목록에 추가할게요!

관련 도움말


리셀러가 브랜드와 고객 설정을 맞춤 구성할 수 있는 화이트 라벨 앱 패키지를 소개하고 있어요.

방법: 화이트 라벨 앱 재판매하기

app-control-panel.com은 리셀러에게 적합한 화이트 라벨 제품을 제공해요. 앱을 효과적으로 재판매하는 데 도움이 되는 몇 가지 팁을 알려드릴게요.

Android 휴대전화가 권한 설정을 업데이트한 후 알림을 받고 있어요.

Android 13에 대비하도록 앱 업데이트하기

Android 13이 출시되었으며, 푸시 알림을 받으려면 앱을 업데이트해야 해요.

앱 화면이 기기 프레임 안에 배치되어 완성도 높은 스크린샷 세트로 준비된 모습이에요.

앱 스크린샷 촬영 및 편집하기

저희가 앱용으로 촬영한 스크린샷을 편집하는 방법과 직접 스크린샷을 촬영하는 방법을 알려드릴게요.


작성자 Jan Bunk
작성자
Jan Bunk

컴퓨터 과학을 전공한 Jan은 2019년에 app-control-panel.com을 설립하고 웹사이트를 앱으로 변환하는 기반 소프트웨어를 개발했어요. 수백 개의 앱을 출시하며 쌓은 경험과 피드백을 바탕으로 앱 제작, 게시, 유지 관리에 관한 모든 과정을 쉽게 따라 할 수 있는 가이드로 안내하기 위해 노력하고 있어요.