v0 + Claude Code + LINEミニアプリで美容室予約アプリを作ってみた | DevelopersIO
はじめに 今回、各種生成AIツールとLINEエコシステムを活用して、美容室予約アプリを一から開発・デプロイしました。Claude Codeと協力して、Next.js 15、Convex、Vercel、LINEミニアプリを組み合わせたリアルタイム予約アプリを構築した体験をまとめます。 LINEミニアプリとして動作する予約システム LINEユーザーIDの自動DB記録とCRM機能 スタッフ向け予約管理ダッシュボード マイ予約ページでの予約履歴管理 開発プロセス 1. 要件定義・プロトタイプ作成 開発開始前に、ChatGPTとv0を活用してプロジェクトの方向性を固めました。 ChatGPTでの要件整理 まずはシンプルなプロンプトで要望を出してもらい、その後、ユーザー体験、スタッフ体験、業務要件、機能要件、非機能要件を出してもらいました。 v0でのモックプロトタイプ生成 ユーザー体験、スタッフ体験、
【2026年1月8日適用】LINEミニアプリ「チャネル同意の簡略化」必須化への対応ガイド - Qiita
はじめに 2025年10月31日、LINE Developersで重要な仕様変更が発表されました。 2026年1月8日以降に作成される日本向けの新規LINEミニアプリチャネルにおいて、「チャネル同意の簡略化」機能の利用が必須となります。 この記事では、仕様変更の内容と、開発者として必要な対応について解説します。 「チャネル同意の簡略化」とは 「チャネル同意の簡略化」は、LINE Developers Consoleの「ウェブアプリ設定」タブで設定できる機能です。 この機能をオンにすると、下記のようにミニアプリをすぐに利用できるようになります。 一方で、機能で同意がスキップされる権限はユーザーID（openidスコープ）のみに限定され、ユーザーのプロフィール情報取得やメッセージ送信に必要な権限（profileスコープやchat_message.writeスコープなど）は取得できないため、改め
何気に重要かも？LINE Messaging APIのテキストメッセージv2を調べてみた - Qiita
こんにちは、のびすけです。 しれっと？リリースされていたテキストメッセージv2ってなんだ？ってところを調べてみます。 テキストメッセージv2って？ Messaging APIにおいて、新しいメッセージオブジェクトとしてテキストメッセージ（v2）をリリースしました。テキストメッセージ（v2）を用いることで、ユーザーへのメンションを指定できます。また、従来より提供しているテキストメッセージに比べて、LINE絵文字をより指定しやすくなりました。 ということで現状通常のメッセージと何が違うのか 大きな感じでまとめると、 テキストメッセージの中で変数展開ができるようになった というイメージだと思います。 例えば、ドキュメントにあるWelcome, {user1}! {laugh}\n{everyone} There is a newcomer!というメッセージを送ると、 Welcome, @のびすけ
LINEがLIFFアプリをミニアプリに統合すると発表したので違いを調べてみた - Qiita
はじめに タイトルの記事を置いておきます。 私は基本的にLIFFで色んなプロジェクトを作成することが多いのですが、上の発表があった時にミニアプリで実装してみたことが無いなと思ったのでドキュメントを読みつつLIFFとの差分などをまとめていきます。 ドキュメント 差分１：外部ブラウザで開いた時の表示の仕方 個人的にはメリットだと感じています。 LIFF ミニアプリ 実際LIFFを使用する場合、外部ブラウザで動作させてもLIFFを使うメリットが得られないのでliff.isInClient()などを用いてLIFF上で動作しているかを判断してLIFF上でなければLIFF上に誘導するという機能を実装する場面も多くあります。 LIFFは、LIFF URLをLINEのアプリケーションの外に設置した場合、そのリンクをクリックするユーザーが使用している端末が最後にブラウザで開いたかLINEアプリで開いたかなど
LINE APIでリッチメッセージは送れる？方法を探りました | ウェブマーケッターOKBのウェブマーケティングスキル集
こんにちは。サイト管理人OKBです。 さて、今回の内容は「LINE MESSAGING API でリッチメッセージの送信はできるのか！？」です。 動画を見ていただけます通り、APIからのプッシュ配信によって、画像のタップ位置によってテキストの内容を変えて反応したり、違うリンクURLをつけることだって可能です。 ただこれが出来るまで少々苦戦しまして、苦戦した理由とともに実装内容をご紹介致します。 ※GAS(Google Apps Script)を使用しています。 画像メッセージはどうか… 参考：https://developers.line.biz/ja/reference/messaging-api/#image-message 画像メッセージは「画像を大きく表示する」ことができるメッセージ方法となり、画像をタップした際にテキストを返したりリンクを指定することができません！ なのでリッチメ
LINEが提供しているクーポンをシステムから配信できるか調べてみた | DevelopersIO
LINE Pay特典クーポンや、LINEクーポンはそれぞれ特定のLINEサービス内で利用するものですので、ここではLINE公式アカウントクーポンに絞って調査を進めました。 システムからLINE公式アカウントクーポンを配信する方法 LINE公式アカウントへのメッセージ配信は、特殊なものを除き以下の2つがあります。 LINE公式アカウントマネージャー（LINE OAM） Messaging API LINE公式アカウントクーポンは、LINE OAMでメッセージ配信するのが通常の使い方となります。LINE OAMの画面でぽちぽちするだけで配信可能です。MessagingAPIはメッセージタイプとしてLINE公式アカウントクーポンを指定することが出来ないので配信不可です。 これは試合終了かな・・・と思いつつもう少し調べてみたところ、クーポンのURLを利用することで一応配信可能でした。 クーポンのU
SNSシェアボタンをHTMLとJavaScriptでつくる【Twitter/Facebook/LINE/hatena/pocket】
ブログやメディアサイトではほとんどが実装しているSNSシェアボタン。 公式のプラグインを使うと、簡単にシェアボタンを作成することができます。 しかし、デザインがプラットフォームによってバラバラであることや文言の調整が難しい点からスクラッチでつくりたいなーと思い、CSSで自由にカスタマイズ可能なHTML側のコピペ用SNSシェアボタンのコードをまとめてみました。 スクラッチでつくれば、統一したデザインでつくれるので、ぜひ参考にしていただければと思います。 SNS ボタンをスクラッチでつくる際の注意点 ボタンをつくってデザインを編集する際、一旦SNSのプラットフォーム側のブランドガイドラインを確認しましょう。 公式のブランドガイドラインには、アイコンを斜めにしてはいけない・視認性の悪い組み合わせにしない等のルールが書いてあります。 あと、現在開いているページのURLをシェアするにはJavaScr
diff -rでディレクトリ同士を比較しつつ特定ファイル名の結果だけ表示 - Qiita
はじめに ディレクトリ同士をdiffコマンドで再帰的に比較するときは、 diff -r <dir1> <dir2>みたいにしますよね。 その中で特定ファイル名の結果を除外したい場合は diff -r -x <filename> <dir1> <dir2>みたいにすればOK。 参考： https://linuxjm.osdn.jp/html/gnumaniak/man1/diff.1.html しかし！除外はできるくせに「特定ファイル名の結果だけを表示」ってのは diffコマンドの機能としては存在しないようです。 -qオプション付きであれば、diff -qr <dir1> <dir2> | grep <filename>でOKだけど、 ファイルの中身までちゃんと見たいときはそうは行かない。 やりたくなる度に調べては「やっぱないよなー。。。」ってガッカリしてたんですが、 無いならシェルスクリプ
LINE, Facebook, Instagramなどの内部ブラウザ表示・WebViewで表示した際のAuth0ログイン・エラーについて
こんにちは、AIQ株式会社のフロントエンドエンジニアのまさぴょんです！ 今回は、LINE, Facebook, Instagramなどの内部ブラウザ表示・WebViewで表示した際のAuth0ログイン・エラーについて、解説します。 LINE以外でも、Auth0ログイン・エラーというトラップ 以前の記事で、LINEの内部ブラウザだと、Auth0のGoogleログイン機能がエラーになる事件が起きたことと、その対応内容を書きました。 それから数日後、今度は、Instagramの内部ブラウザでもAuth0のGoogleログイン機能がエラーになる事件が起きたとの話が。。。😇 Auth0のGoogleログイン機能を使って、Loginしようとすると、 「アクセスをブロックしました。xxxxxのリクエストはGoogleのポリシーに準拠していません」 というエラーが発生するとのこと。 LINE対応で解決と
【知ってお得な番外編】LINEミニアプリに関する4つの豆知識 | 株式会社アイリッジ
LIFFアプリって？ LINEが提供している開発者向けサービスのひとつに、LIFF（LINE Front-end Framework）というフレームワークがあります。 このLIFF上で動作するアプリを、LIFFアプリと呼びます。 では、同じくLIFF上で動作するLINEミニアプリとは何が違うのでしょうか。 実は、両者は「アプリ」としては基本的に同じ作られ方をしています。 決定的に違うのは、「ミニアプリ」としてLINE社に申請を出し、認可されたかどうかです。 ミニアプリとして認可された結果として、様々な追加機能を得ることができます。 ①ミニアプリ上に、LINEホームにアプリを追加するためのクリック領域が追加される LIFFアプリのままではLINEホームに追加することができないので、継続利用促進の面でミニアプリの方が有利となります。 ②ミニアプリのQRコードを読み込むと同時に、公式アカウントの
Line Messaging API を使う - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに こんにちは。初投稿となります！ 普段、Qiita にはお世話になっているので、自分も何かしらのアウトプットで誰かの助けになれればと思い、投稿してみることにしました。 また、自分の忘備録の意味合いもあります。 つたない文章ではありますが、ぜひ最後まで読んでいただけると嬉しいです！ 初テーマについては、Line Messaging API にしました。 Line で bot を作れるあれです。 自分が何かを開発するときに、UI の作成がいつもネックになるので、UI の代わりとして重宝しています。 簡単な入力に対する応答とかであれば
ChatGPT API で LINE のチャットボットをノーコードで作り、ファインチューニング
Chat GPTの登場で様々な可能性が広がっている中で、 「企業や店舗のLINE公式でAIチャットボットを使いたい」 「ノーコードツールmakeを使っているが、LINEとの連携方法を知りたい」 「LINE登録して特定のメッセージをくれたら自動でクーポンを配布したい」 「LINEとChat GPTを連携して自動チャットBotの作成方法を知りたい」 このような悩みを抱えていませんか？ 記事内容として下記のことがわかります。 ・Chat GPTを利用するためのAPI設定方法がわかる ・LINEのAPIとChat GPTのAPIとの連携方法がわかる ・API同士を連携するノーコードツール「make」でシナリオ作成方法がわかる ・アプリケーションに合わせたカスタマイズ方法がわかる この記事では、下記のデータを参考に解説します。 ・当社エンジニア会社の監修を得ている ・Chat GPT公式のドキュメン
【めっちゃ簡単】POSTMANを活用しLINEAPIへのリクエストをお試ししてみる｜たくあん
こんにちは！ LINE APIのコンサルティングやプリセールスをしてます、たくあんです。 みなさん！ LINE APIを簡単に試せるって言ったらすごく興味わきませんか？！ 今回は簡易にプラットフォーマーが提供するAPIやSaaSサービスへリクエストが実施できるツール「POSTMAN」を利用してLINE APIをリクエストするところまでを記載していきます。 お試しいただく前に、LINE公式アカウントや前準備が必要です。 以下のnoteにて開設からMessagingAPI化を説明しているので前準備が出来ていない方は以下へジャンプしてみてください！ ▼「POSTMAN」とは・・・Web APIのテストクライアントサービスのひとつです。 色々なクライアントの動きをテストできるようスクリプト拡張や、テストスイートシナリオの作成などの機能があります。 転載：こちら 以下のページアクセスいただき「POS
【決定版】LINE 公式アカウントを開設しMessaging APIを利用してみる！｜たくあん
こんにちは、たくあんです。 私は普段、LINE APIを活用したソリューション提案やコンサルをしております！！ みなさん！ LINE公式アカウント開設〜MessagingAPI化ってめっちゃ簡単なんですよ！ 知ってました？ このnoteでは、LINE公式アカウントの開設から実際にLINE APIの Messaging APIを連動するやり方をご紹介しようと思います。 やり方はすごく簡単で、おおよそ数画面でLINE公式アカウントの開設〜MessagingAPI化が出来ちゃいます！ ▼LINE Developers アカウントの作成（画面キャプチャやこちらに貼る画像は LINE PC版 のキャプチャ機能を活用しています。便利なので、是非使ってみてください。） LINE Developersとは、サイト上に説明があるため引用しますｗ LINE Developersサイトは開発者向けのポータルサイ
LaravelアプリケーションにLINEログインを実装しよう！ | eF-4 developer & creator blog
前置き はじめまして！ 最近ようやく重い腰を上げてLaravelの勉強を始めた、エンジニアのかずみです。よろしくお願いします。 Laravelなかなか難しいですね…。とりあえずということで、ログイン認証機能を試して、色々作って試して壊して(?)…と進めていた中で、最近色々なサイトで使われている「ソーシャルログイン」を使った連携ログインを試してみたくなりました。 PHPのWebアプリケーションフレームワークであるLaravelには、『Laravel Socialite』というOAuth2認証によるソーシャルログインを行うためのオプションパッケージが用意されています。このパッケージを利用すると、TwitterやFacebookなど6種サービスによるソーシャルログイン機能が簡単に実装できます。また、『Socialite Providers』には多数のOAuth2サービスプロバイダに対応したアダプ
LINEの自動ログインができない？！LINEのID連携やLINEログインが失敗する原因と解決策
LINEログインを利用しようとした際、「リッチメニューやマイページからLINEログイン（ID連携）をしようとしてもうまくいかない」「LINEで自動ログイン（オートログイン）ができない」「LINEログインを利用して会員登録しようとしたが、エラーが出てしまう」といった事象が発生することがあります。 この記事では、LINEのID連携や自動ログイン（オートログイン）などLINEログインの処理がうまくいかないエラーの原因と解決策をご紹介します。 LINEのID連携やLINEログインを行う際の正常な画面遷移 まず、LINEのID連携やLINEログインの流れを見てみましょう。 通常であれば、ユーザーがLINEログインのボタンをタップ後、ブラウザからLINEアプリに遷移し、LINEの自動ログインが行われます。認可画面で同意した後は標準ブラウザ（iOSならSafari・AndroidならChromeなどのデ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ニュース： LINEミニアプリにおいて、2025年10月よりすべてのユーザーがウェブブラウザでサービスを利用できるようになります
[エンジニア向け]10分で出来るLINEミニアプリの開発準備〜動作確認まで - Qiita![[エンジニア向け]10分で出来るLINEミニアプリの開発準備〜動作確認まで - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/5697917b076f38041f1c83be8757f898b35dcac0/backend=imagemagick;height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFtYXpvbmF3cy5jb20lMkYwJTJGMTY0MTUzJTJGcHJvZmlsZS1pbWFnZXMlMkYxNTQ0NDA2ODc1P2l4bGliPXJiLTQuMC4wJmFyPTElM0ExJmZpdD1jcm9wJm1hc2s9ZWxsaXBzZSZiZz1GRkZGRkYmZm09cG5nMzImcz0zMWU5ODBiZmQyYjI1NGU5OGExYzdmNDg2ZThlZTU1MQ%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253De3f8e87da03fcad6b3a4401979695f4a%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9JTVCJUUzJTgyJUE4JUUzJTgzJUIzJUUzJTgyJUI4JUUzJTgzJThCJUUzJTgyJUEyJUU1JTkwJTkxJUUzJTgxJTkxJTVEMTAlRTUlODglODYlRTMlODElQTclRTUlODclQkElRTYlOUQlQTUlRTMlODIlOEJMSU5FJUUzJTgzJTlGJUUzJTgzJThCJUUzJTgyJUEyJUUzJTgzJTk3JUUzJTgzJUFBJUUzJTgxJUFFJUU5JTk2JThCJUU3JTk5JUJBJUU2JUJBJTk2JUU1JTgyJTk5JUUzJTgwJTlDJUU1JThCJTk1JUU0JUJEJTlDJUU3JUEyJUJBJUU4JUFBJThEJUUzJTgxJUJFJUUzJTgxJUE3JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LXBhZD0wJnM9ZGVlNDk2NWIzNWU2YzIxNzQyMDVmOWFjMDczMWE5YzU%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBzdGFjaGliYW5hJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LXBhZD0wJnM9ZjViMTUwYjgwNTRiOWI5M2Q2ODcyODIxZTY3MmQ0Mjg%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3De631899bb5dc58c341e8fb5148e1ba52)
【完全ガイド】LINEミニアプリ開発からデプロイまでを丁寧に解説 | ギークの逆襲 🐟
OSS（オープンソースソフトウェア） | LINE API UseCase
