検索
ホームページウェブフロントエンドjsチュートリアルnode.jsで最初の電報チャットボットを構築する方法

node.jsで最初の電報チャットボットを構築する方法

それで、今朝、あなたはあなたが読んだ興味深い記事を保存してラベル付けする方法を開発するというアイデアで目を覚ましました。このアイデアで遊んだ後、あなたは電報チャットボットがこの問題の最も便利なソリューションであると考えています。 このガイドでは、javaScriptとnode.js.

を使用して、最初の電報チャットボットを構築するために知っておくべきことをすべて説明します。

開始するには、APIアクセストークンを受け取るには、いわゆるボットファーザーと新しいボットを登録する必要があります。

キーテイクアウト

ボットを電報でボットファーザーに登録して、ボットのコードを実行するために必要なAPIアクセストークンを取得します。

javascriptとnode.jsを使用してボットをコーディングします。このチュートリアルでは、2つの依存関係を持つSimple node.jsプロジェクトを使用しています。DotenvとNode-Telegram-bot-api。
  • APIアクセストークンを渡し、ポーリングオプションをtrueに設定して、ボットコマンドを作成します。これにより、ボットは定期的に着信メッセージをチェックできます。
  • 事前定義されたオプションを備えたキーボードの送信など、高度なオプションを探索します。人の電話番号やジオロケーションなどのデータをリクエストすることもできます。
  • ボットを展開するには、Heroku、AWS、Google Cloud、または従来のホスティングプロバイダーなどのクラウドプラットフォームを使用できます。正確なプロセスは、選択したプラットフォームによって異なります。
  • @botfather
  • とのボット登録
  • 私たち自身の電報ボットに向けた最初のステップは、ボットファーザーとボットを登録することです。ボットファーザーは、あなたの人生をはるかに楽にするボット自体です。ボットの登録、ボットの説明の変更、コマンドの追加、ボットのAPIトークンを提供するのに役立ちます。
  • APIトークンは最も重要なステップです。これにより、ボットのタスクを実行できるコードを実行できるため、最も重要なステップです。
  • 1。ボットファーザーを見つける

ボットファーザーは、「ボットファーザー」を検索することで電報で見つけることができます。 Blue Circleの白いチェックマークアイコンで示された公式のボットファーザーをクリックします。

2。新しいボットの登録

ボットファーザーを見つけました、彼と話しましょう! Typing /Newbotで会話を開始できます。ボットファーザーは、あなたの両方の名前を選ぶように頼みます。この名前は何でもかまいません。ユニークである必要はありません。物事をシンプルに保つために、私は私のボットのarticlebotに名前を付けました。

次に、ボットのユーザー名を入力するように求められます。ユーザー名は一意であり、ボットで終了する必要があります。したがって、そのユーザー名はまだ取得されていないため、Michiel_article_botを選択しました。これは、Telegramの検索フィールドでボットを調べるために使用するユーザー名でもあります。node.jsで最初の電報チャットボットを構築する方法

fatherbotは、Telegram HTTP APIにアクセスするためにトークンで成功メッセージを返します。このトークンを安全に保管してください。確かに他の人と共有しないでください。

node.jsで最初の電報チャットボットを構築する方法 3。ボットの変更

説明を追加するか、ボットに知っておきたいコマンドを設定することにより、ボットをさらに変更できます。テキスト /setCommandsでボットにメッセージを送ることができます。コマンドをフォーマットコマンド1-説明で入力する方法を示します。

私のボットについては、コマンドブックマークを設定します - 興味深い記事のurlを保存します。

ボットを調べると、利用可能なコマンドを表示するコマンドアイコンがチャットボックスに表示されます。ボットファーザーを介してそれらをリストしないで、作業を行うより多くのコマンドを作成できます。ただし、UXの観点からは、Votfatherに利用可能なすべてのコマンドを登録することをお勧めします。

node.jsで最初の電報チャットボットを構築する方法 /setPrivacyを使用してボットのプライバシーを設定できます。有効または無効にすることができます。デフォルトでは、プライバシー値が有効になるように設定されています。つまり、ボットは /シンボルから始まるメッセージのみを受信します。

この設定は無効にすることができます。つまり、ボットはグループに送信されるすべてのメッセージを受信できます。これらのすべてのメッセージを受信するには、グループにボットを追加する必要があります。

node.jsで最初の電報チャットボットを構築する方法利用可能なすべてのコマンドのリストはこちらにあります:

最後に、私たちはすべてコーディングを開始する予定です。 APIアクセストークンの準備ができていることを確認してください 最初のボットコマンドのコーディング

node.jsで最初の電報チャットボットを構築する方法

まず、このチュートリアルでは、準備した次のコードを使用します。

node.jsで最初の電報チャットボットを構築する方法これは、dotenvとnode-telegram-bot-apiの2つの依存関係しかない単純なnode.jsプロジェクトです。最初のパッケージは、APIアクセストークンを保持する.ENV構成ファイルの作成に使用されます。 2番目のパッケージは、Telegram Bots APIのnode.jsラッパーとして機能します。これは、このチュートリアルに使用します。

1。プロジェクトのセットアップ

開始するには、GitHubリポジトリをクローンして、お気に入りのエディターでプロジェクトを開きます。次に、プロジェクトのルートに.ENVファイルを作成し、単一の行を追加します - token = yourtoken。ボットファーザーから受け取ったトークンにあなたのトークンを置き換えてください。

接続が機能することを確認するには、端末のプロジェクトのルートに移動し、NPMの開始を実行します。 npm startコマンドはapp.jsファイルを実行し、ボットに接続する必要があります。エラーが表示されない場合は、行ってもいいです!

2。最初のボットコマンドを作成

まず、APIアクセストークンを渡し、ポーリングオプションをtrueに設定して、ボットを作成する必要があります。これは、ボットが定期的な間隔で着信メッセージをチェックすることを意味します。

<span>require('dotenv').config();
</span><span>const TelegramBot = require('node-telegram-bot-api');
</span>
<span>const token = process.env.TOKEN;
</span>
<span>// Created instance of TelegramBot
</span><span>const bot = new TelegramBot(token, {
</span>   <span>polling: true
</span><span>});
</span>
ボットが作成されました。 /ブックマークコマンドを表すコードの次のスニペットを見てみましょう。受信テキストメッセージのリスナーを設定し、ONTEXTを設定し、REGEX文字列で指定しているため、 /ブックマークから始まるメッセージを探すように指定します。

メッセージが /ブックマークから始まると、コードが実行されます。まず第一に、このユーザーのチャットにメッセージを送り返すことができるようにしたいので、チャットIDを保存します。

次に、ユーザーがコマンドを正しく使用しているかどうかを確認します。このようなコマンドを使用してURLに渡されると予想されます: /ブックマークwww.google.com。

指定されているURLがない場合は、保存されているChatIDにメッセージを送り返し、URLを提供するようユーザーに指示します。彼らがURLを送信する場合、URLを保存して成功メッセージを送信します。

コールバック関数MSGと一致に2つのパラメーターを使用していることに気付いたかもしれません。 MSGプロパティは、受信した完全なメッセージを表し、一致すると、定義した正規表現の結果を表します。下の画像は完全なMSGを示しています。

ボットとのチャットでコマンドを試してみると、次の結果が得られます。

<span>// Listener (handler) for telegram's /bookmark event
</span>bot<span>.onText(<span>/<span>\/bookmark</span>/</span>, (msg<span>, match</span>) => {
</span>   <span>const chatId = msg.chat.id;
</span>   <span>const url = match.input.split(' ')[1];
</span>   <span>// 'msg' is the received Message from Telegram
</span>   <span>// 'match' is the result of executing the regexp above on the text content
</span>   <span>// of the message
</span>
   <span>if (url === undefined) {
</span>       bot<span>.sendMessage(
</span>           chatId<span>,
</span>           <span>'Please provide URL of article!',
</span>       <span>);
</span>       <span>return;
</span>   <span>}
</span>
   <span>URLs.push(url);
</span>   bot<span>.sendMessage(
</span>       chatId<span>,
</span>       <span>'URL has been successfully saved!',
</span>   <span>);
</span><span>});
</span>
同じ結果が表示されたら、おめでとうございます!最初のボットコマンドを作成しました。事前定義されたオプションでキーボードを送信するなど、より高度なオプションを見てみましょう。

3。キーボードオプション

node.jsで最初の電報チャットボットを構築する方法カスタムコマンドの作成方法がわかりました。キーボードオプションを詳しく見てみましょう。ユーザーのオプションを制限するために、コマンドを使用して事前定義されたキーボードを送信することができます。ユーザーがyesまたはno.

で答えるように制限するのと同じくらい簡単です

3.1通常のキーボードnode.jsで最初の電報チャットボットを構築する方法

次のコードのスニペットを見てみましょう。 bot.sendmessage関数に3番目のパラメーターを追加しました。このオブジェクトは、キーボードのオプションを定義します。 Reply_markup.keyboardを詳しく見ると、より多くの配列を含む配列があります。ここのすべての配列は、オプションのある行を表します。これは、より重要な、またはボタンテキストが長いフォーマットオプションを使用するのに役立ちます。

このコードは、ボットにメッセージ /キーボードを送信するときに次の結果を示します。

さらに、オプションごとに追加のデータを使用してインラインキーボードを定義することもできます。

3.1インラインキーボード

インラインキーボードがチャットに表示され、メッセージ入力ボックスの下ではありません。送信したURLにラベルを付けるため、ユーザーに利用可能なカテゴリを表示することでこれを行うことができます。これが私たちのキーボードの見た目です:

node.jsで最初の電報チャットボットを構築する方法

下のコードを見てみましょう。 Reply_markupは、プロパティInline_Keyboardを定義するようになりました。残りのマークアップは同じままです。すべての配列は行を表します。ただし、テキストを渡すだけでなく、テキストとcallback_dataを渡すオブジェクトを渡して、選択したオプションを知ることもできます。

<span>require('dotenv').config();
</span><span>const TelegramBot = require('node-telegram-bot-api');
</span>
<span>const token = process.env.TOKEN;
</span>
<span>// Created instance of TelegramBot
</span><span>const bot = new TelegramBot(token, {
</span>   <span>polling: true
</span><span>});
</span>
次のセクションでは、コールバックデータを受信するためにハンドラーを使用する方法について説明します。

3.2キーボードからのコールバック

コールバックデータを受信したい場合は、このタイプのイベントを聞く必要があります。

callbackqueryのメッセージプロパティには、ユーザーからのメッセージ全体が含まれています。データプロパティには、カテゴリコールバックデータが含まれています

今までに設計エラーが発見された可能性があります。コールバックデータを送信する2つのコマンドがある場合はどうなりますか?非常に奇妙な動作や返信が得られるかもしれません。
<span>// Listener (handler) for telegram's /bookmark event
</span>bot<span>.onText(<span>/<span>\/bookmark</span>/</span>, (msg<span>, match</span>) => {
</span>   <span>const chatId = msg.chat.id;
</span>   <span>const url = match.input.split(' ')[1];
</span>   <span>// 'msg' is the received Message from Telegram
</span>   <span>// 'match' is the result of executing the regexp above on the text content
</span>   <span>// of the message
</span>
   <span>if (url === undefined) {
</span>       bot<span>.sendMessage(
</span>           chatId<span>,
</span>           <span>'Please provide URL of article!',
</span>       <span>);
</span>       <span>return;
</span>   <span>}
</span>
   <span>URLs.push(url);
</span>   bot<span>.sendMessage(
</span>       chatId<span>,
</span>       <span>'URL has been successfully saved!',
</span>   <span>);
</span><span>});
</span>
したがって、

コールバックデータが属するコマンドを識別するためのラベルも保持しているStringified JSONオブジェクトを送り返すことをお勧めします。次のベストプラクティスをご覧ください:

コマンドオプションのデータを使用して、このコマンドの特定のビジネスロジックに切り替えることができます。

私たちは電報ボットジェディスになるために順調に進んでいます。完全に学習したマスターになるには、データリクエストを調べてみましょう

3.3データリクエスト - 電話番号
<span>// Listener (handler) for showcasing different keyboard layout
</span>bot<span>.onText(<span>/<span>\/keyboard</span>/</span>, (msg) => {
</span>   bot<span>.sendMessage(msg.chat.id, 'Alternative keybaord layout', {
</span>       <span>'reply_markup': {
</span>           <span>'keyboard': [['Sample text', 'Second sample'], ['Keyboard'], ['I\'m robot']],
</span>           <span>resize_keyboard: true,
</span>           <span>one_time_keyboard: true,
</span>           <span>force_reply: true,
</span>       <span>}
</span>   <span>});
</span><span>});
</span>

人の電話番号やジオロケーションなど、データをリクエストすることができます。このチュートリアルでは、代替キーボードを使用して電話番号をリクエストする方法を紹介します。

ユーザーはチャットで次のリクエストを受け取ります:

電話番号をクリックすると、次の電話番号がリクエストされます。

これは、アクセスを提供する後の見方です:
<span>// Listener (handler) for telegram's /label event
</span>bot<span>.onText(<span>/<span>\/label</span>/</span>, (msg<span>, match</span>) => {
</span>   <span>const chatId = msg.chat.id;
</span>   <span>const url = match.input.split(' ')[1];
</span>
   <span>if (url === undefined) {
</span>       bot<span>.sendMessage(
</span>           chatId<span>,
</span>           <span>'Please provide URL of article!',
</span>       <span>);
</span>       <span>return;
</span>   <span>}
</span>
   tempSiteURL <span>= url;
</span>   bot<span>.sendMessage(
</span>       chatId<span>,
</span>       <span>'URL has been successfully saved!',
</span>       <span>{
</span>           <span>reply_markup: {
</span>               <span>inline_keyboard: [[
</span>                   <span>{
</span>                       <span>text: 'Development',
</span>                       <span>callback_data: 'development'
</span>                   <span>}, {
</span>                       <span>text: 'Lifestyle',
</span>                       <span>callback_data: 'lifestyle'
</span>                   <span>}, {
</span>                       <span>text: 'Other',
</span>                       <span>callback_data: 'other'
</span>                   <span>}
</span>               <span>]]
</span>           <span>}
</span>       <span>}
</span>   <span>);
</span><span>});
</span>

最後に!あなたは完全に学習した電報ボットジェダイです。今のところ、詳細とリソースはこちらをご覧ください:node.jsで最初の電報チャットボットを構築する方法

プライベートメッセージとパブリックメッセージの違いnode.jsで最初の電報チャットボットを構築する方法

さまざまな種類のイベント

GithubのHosein2398によるnode.jsで最初の電報チャットボットを構築する方法チュートリアル

    ここでもご期待ください - 来月、Telegram APIの高度な機能をさらに深く掘り下げるチュートリアルを使用して戻ってきます。

    node.js

    で最初の電報チャットボットを構築することに関するよくある質問(FAQ)

    node.js?

    を使用して電報チャットボットを構築するための前提条件は何ですか?また、コンピューターにnode.jsとnpm(ノードパッケージマネージャー)をインストールする必要があります。さらに、Botfatherを使用してTelegramにボットを作成する必要があります。これにより、Telegram APIと対話するために使用するトークンが提供されます。 🎜>

    ボットファーザーは、新しいボットを作成できるテレグラムのボットです。新しいボットを作成するには、ボットファーザーとのチャットを開始し、プロンプトに従ってください。ボットの名前とユーザー名を選択するように求められます。これを完了すると、ボットファーザーはトークンを提供します。これをTelegram APIと対話するために使用します。 🎜> node.jsを使用してTelegram APIと対話するには、Node-Telegram-Bot-APIパッケージを使用できます。このパッケージは、Telegram APIのシンプルで強力なインターフェイスを提供します。 NPMを使用してインストールしてから、コードに必要です。次に、ボットファーザーが提供するトークンを使用して新しいボットを作成し、パッケージが提供するメソッドを使用してAPIと対話することができます。 Node-Telegram-Bot-APIパッケージは、ボットに送信されたテキストメッセージを処理するために使用できるOntextメソッドを提供します。この方法は、正規表現とコールバック関数を引数として取ります。コールバック関数は、正規表現に一致するメッセージが受信されるたびに呼び出されます。メッセージオブジェクトはコールバック関数に渡され、メッセージに応答するために使用できます。 Node-Telegram-Bot-APIパッケージで提供されるSendMessageメソッドを使用します。このメソッドは、受信者のチャットIDとメッセージのテキストの2つの引数を取ります。 ontextメソッドのコールバック関数に渡されたメッセージオブジェクトからチャットIDを取得できます。

    ボットを展開するにはどうすればよいですか?サーバーに継続的に実行できるようにします。これには、Heroku、AWS、Google Cloudなどのクラウドプラットフォームや、従来のホスティングプロバイダーなど、多くのオプションがあります。正確なプロセスは、選択したプラットフォームに依存しますが、通常、コードをプラットフォームにプッシュし、プラットフォームのツールを使用してボットを起動します。

    写真やステッカーなどのさまざまな種類のメッセージを処理するにはどうすればよいですか?

    ​​

    ノードテレグラムボット-APIパッケージは、さまざまな種類のメッセージを処理する方法を提供します。たとえば、Onphotoメソッドを使用して写真メッセージを処理したり、Stickerメソッドを使用してステッカーメッセージを処理できます。これらのメソッドは、対応するタイプのメッセージが受信されたときに呼び出されるコールバック関数を使用します。 Node-Telegram-Bot-APIパッケージによって提供されるコマンドメソッドを使用して、ボットにカスタムコマンドを追加します。この方法では、引数として文字列とコールバック関数を採用します。文字列はコマンドの名前であり、コールバック関数はコマンドを受信したときに呼び出されます。コールバック関数に渡されたメッセージオブジェクトを使用してコマンドに応答できます。チャットのフィールド。 Node-Telegram-Bot-APIパッケージには、OninlineQueryメソッドが提供されます。これを使用して、インラインクエリを処理できます。このメソッドは、インラインクエリが受信されたときに呼び出されるコールバック関数を取得します。コールバック関数に渡されたインラインクエリオブジェクトを使用してクエリに応答できます。一般的な方法の1つは、コードにconsole.logステートメントを使用して、ボットの状態に関する情報を印刷することです。 Node.jsデバッガーやChrome Devtoolsなどのデバッグツールを使用することもできます。さらに、ノードテレグラムボットAPIパッケージは、ボットの実行中に発生するエラーを処理するために使用できるOnerrorメソッドを提供します。

以上がnode.jsで最初の電報チャットボットを構築する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
舞台裏:JavaScriptをパワーする言語は何ですか?舞台裏:JavaScriptをパワーする言語は何ですか?Apr 28, 2025 am 12:01 AM

JavaScriptはブラウザとnode.js環境で実行され、JavaScriptエンジンに依存してコードを解析および実行します。 1)解析段階で抽象的構文ツリー(AST)を生成します。 2)ASTをコンパイル段階のバイトコードまたはマシンコードに変換します。 3)実行段階でコンパイルされたコードを実行します。

PythonとJavaScriptの未来:傾向と予測PythonとJavaScriptの未来:傾向と予測Apr 27, 2025 am 12:21 AM

PythonとJavaScriptの将来の傾向には、1。Pythonが科学コンピューティングの分野での位置を統合し、AI、2。JavaScriptはWebテクノロジーの開発を促進します。どちらもそれぞれのフィールドでアプリケーションシナリオを拡大し続け、パフォーマンスをより多くのブレークスルーを行います。

Python vs. JavaScript:開発環境とツールPython vs. JavaScript:開発環境とツールApr 26, 2025 am 12:09 AM

開発環境におけるPythonとJavaScriptの両方の選択が重要です。 1)Pythonの開発環境には、Pycharm、Jupyternotebook、Anacondaが含まれます。これらは、データサイエンスと迅速なプロトタイピングに適しています。 2)JavaScriptの開発環境には、フロントエンドおよびバックエンド開発に適したnode.js、vscode、およびwebpackが含まれます。プロジェクトのニーズに応じて適切なツールを選択すると、開発効率とプロジェクトの成功率が向上する可能性があります。

JavaScriptはCで書かれていますか?証拠を調べるJavaScriptはCで書かれていますか?証拠を調べるApr 25, 2025 am 12:15 AM

はい、JavaScriptのエンジンコアはCで記述されています。1)C言語は、JavaScriptエンジンの開発に適した効率的なパフォーマンスと基礎となる制御を提供します。 2)V8エンジンを例にとると、そのコアはCで記述され、Cの効率とオブジェクト指向の特性を組み合わせて書かれています。3)JavaScriptエンジンの作業原理には、解析、コンパイル、実行が含まれ、C言語はこれらのプロセスで重要な役割を果たします。

JavaScriptの役割:WebをインタラクティブでダイナミックにするJavaScriptの役割:WebをインタラクティブでダイナミックにするApr 24, 2025 am 12:12 AM

JavaScriptは、Webページのインタラクティブ性とダイナミズムを向上させるため、現代のWebサイトの中心にあります。 1)ページを更新せずにコンテンツを変更できます。2)Domapiを介してWebページを操作する、3)アニメーションやドラッグアンドドロップなどの複雑なインタラクティブ効果、4)ユーザーエクスペリエンスを改善するためのパフォーマンスとベストプラクティスを最適化します。

CおよびJavaScript:接続が説明しましたCおよびJavaScript:接続が説明しましたApr 23, 2025 am 12:07 AM

CおよびJavaScriptは、WebAssemblyを介して相互運用性を実現します。 1)CコードはWebAssemblyモジュールにコンパイルされ、JavaScript環境に導入され、コンピューティングパワーが強化されます。 2)ゲーム開発では、Cは物理エンジンとグラフィックスレンダリングを処理し、JavaScriptはゲームロジックとユーザーインターフェイスを担当します。

Webサイトからアプリまで:JavaScriptの多様なアプリケーションWebサイトからアプリまで:JavaScriptの多様なアプリケーションApr 22, 2025 am 12:02 AM

JavaScriptは、Webサイト、モバイルアプリケーション、デスクトップアプリケーション、サーバー側のプログラミングで広く使用されています。 1)Webサイト開発では、JavaScriptはHTMLおよびCSSと一緒にDOMを運用して、JQueryやReactなどのフレームワークをサポートします。 2)ReactNativeおよびIonicを通じて、JavaScriptはクロスプラットフォームモバイルアプリケーションを開発するために使用されます。 3)電子フレームワークにより、JavaScriptはデスクトップアプリケーションを構築できます。 4)node.jsを使用すると、JavaScriptがサーバー側で実行され、高い並行リクエストをサポートします。

Python vs. JavaScript:ユースケースとアプリケーションと比較されますPython vs. JavaScript:ユースケースとアプリケーションと比較されますApr 21, 2025 am 12:01 AM

Pythonはデータサイエンスと自動化により適していますが、JavaScriptはフロントエンドとフルスタックの開発により適しています。 1. Pythonは、データ処理とモデリングのためにNumpyやPandasなどのライブラリを使用して、データサイエンスと機械学習でうまく機能します。 2。Pythonは、自動化とスクリプトにおいて簡潔で効率的です。 3. JavaScriptはフロントエンド開発に不可欠であり、動的なWebページと単一ページアプリケーションの構築に使用されます。 4. JavaScriptは、node.jsを通じてバックエンド開発において役割を果たし、フルスタック開発をサポートします。

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

WebStorm Mac版

WebStorm Mac版

便利なJavaScript開発ツール

DVWA

DVWA

Damn Vulnerable Web App (DVWA) は、非常に脆弱な PHP/MySQL Web アプリケーションです。その主な目的は、セキュリティ専門家が法的環境でスキルとツールをテストするのに役立ち、Web 開発者が Web アプリケーションを保護するプロセスをより深く理解できるようにし、教師/生徒が教室環境で Web アプリケーションを教え/学習できるようにすることです。安全。 DVWA の目標は、シンプルでわかりやすいインターフェイスを通じて、さまざまな難易度で最も一般的な Web 脆弱性のいくつかを実践することです。このソフトウェアは、

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強力な PHP 統合開発環境

AtomエディタMac版ダウンロード

AtomエディタMac版ダウンロード

最も人気のあるオープンソースエディター

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール