LPサイトを自動生成するAIツール！「AI Landing Page Generator」の使い方

▶︎動画でも話してるので、文章読むのが面倒な方はこちらをみてもらえればと思います。

今回はAI Landing Page Generatorを使ってウェブページを生成する方法について解説します。

購入はこちらから！

1 ComfyUIを使って崩れた手の形を修正する方法について
- 1.1 Google Colabのサイトにアクセス
2 ComfyUIのソースコードを実行
- 2.1 生成するウェブページの内容を入力
3 スマホでの表示
- 3.1 タブレットなどの少しサイズが小さい画面での表示を確認
4 コードの確認
- 4.1 サイトのテキストを編集

ComfyUIを使って崩れた手の形を修正する方法について

AI Landing Page Generatorのソースコードは公開されています。

ソースコードへのリンクはこちらから！

この解説ではAI Landing Page GeneratorをGoogleコラボで動作させていきます。

Google Colabについての詳細はこちらから！

Google Colabのサイトにアクセス

Google Colabはこちらから！

ここからの流れは下記に詳細リンクを貼っておきますので、そちらからご参照ください。

Google Colabの流れについてはこちらから！

上記の流れではハードウェアアクセラレーターはT4 GPUですが、今回はハードウェアアクセラレーターはCPUを選択してください。

これでGoogleコラボでコードを実行するための準備が整いました。

ComfyUIのソースコードを実行

下記に貼ってあるテキストをコピーします。

import getpass
open_api_key = getpass.getpass("Enter your OpenAI API key: ")

!dpkg --configure -a
!sudo apt-get update
!sudo apt-get install -y ca-certificates curl gnupg
!sudo mkdir -p /etc/apt/keyrings
!curl -fsSL https://deb.nodesource.com/gpgkey/nodesource-repo.gpg.key | sudo gpg --dearmor -o /etc/apt/keyrings/nodesource.gpg
!NODE_MAJOR=18 && echo "deb [signed-by=/etc/apt/keyrings/nodesource.gpg] https://deb.nodesource.com/node_$NODE_MAJOR.x nodistro main" | sudo tee /etc/apt/sources.list.d/nodesource.list
!sudo apt-get update
!sudo apt-get install nodejs -y

!curl -fsSL https://get.pnpm.io/install.sh | sh -

import os
os.environ["PNPM_HOME"] = "/root/.local/share/pnpm"
os.environ["PATH"] = f"{os.environ['PNPM_HOME']}:{os.environ['PATH']}"
os.environ["OPENAI_API_KEY_ARRAY"] = open_api_key

!wget https://github.com/cloudflare/cloudflared/releases/latest/download/cloudflared-linux-amd64.deb
!dpkg -i cloudflared-linux-amd64.deb

import subprocess
import threading
import time
import socket

def iframe_thread(port):
    while True:
        time.sleep(0.5)
        sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
        result = sock.connect_ex(('127.0.0.1', port))
        if result == 0:
            break
        sock.close()

    p = subprocess.Popen(["cloudflared", "tunnel", "--url", f"http://127.0.0.1:{port}"], stdout=subprocess.PIPE, stderr=subprocess.PIPE)
    for line in p.stderr:
        l = line.decode()
        if "trycloudflare.com " in l:
            print("This is the URL to access AI-Landing-Page-Generator:", l[l.find("http"):], end='')

%cd /content
!git clone https://github.com/JustAIGithub/AI-Landing-Page-Generator.git
%cd /content/AI-Landing-Page-Generator

!pnpm install

# スレッドの開始
threading.Thread(target=iframe_thread, daemon=True, args=(3000,)).start()

!pnpm dev

テキストをコピーしたらGoogleコラボの画面に戻り、テキストボックスに先ほどコピーしたテキストを貼り付け、再生ボタンを押します。