[{"data":1,"prerenderedAt":408},["ShallowReactive",2],{"news-item-\u002Fja\u002Fnews\u002Faws-toolkit-for-visual-studio-code":3},{"id":4,"title":5,"body":6,"category":395,"created by":396,"date":397,"description":398,"extension":399,"meta":400,"navigation":401,"path":402,"sections":403,"seo":404,"stem":405,"thumbnail":406,"__hash__":407},"content_ja\u002Fja\u002Fnews\u002Faws-toolkit-for-visual-studio-code.md","AWS Toolkit for Visual Studio Code",{"type":7,"value":8,"toc":381},"minimark",[9,14,18,21,55,61,72,77,91,96,126,132,135,140,148,153,196,202,230,234,244,250,255,269,321,325,333,337],[10,11,13],"h3",{"id":12},"aws-toolkit","AWS Toolkit",[15,16,17],"p",{},"この拡張サービスは開発者にとってAmazon Web Services (AWS)のサーバレスアプリケーションの開発\u002Fデバッグをローカルで行うのに役立てくれます。",[15,19,20],{},"AWS Toolkit for Visual Studio Codeは下記に従えば使用することができます。",[22,23,24,36,43],"ul",{},[25,26,27,28,35],"li",{},"サーバレスアプリケーション開発をローカルで行い、対象のAWSアカウントにデプロイする (参照 ",[29,30,34],"a",{"href":31,"rel":32},"https:\u002F\u002Fmarketplace.visualstudio.com\u002Fitems?itemName=AmazonWebServices.aws-toolkit-vscode#usage",[33],"nofollow","Usage",").",[25,37,38,39,42],{},"対象アカウントのAWSリソースの管理 (参照 ",[29,40,34],{"href":31,"rel":41},[33],")",[25,44,45,46],{},"これは下記のことを含みます:",[47,48,49,52],"ol",{},[25,50,51],{},"登録されているAWS CloudFormationを検索し削除する。",[25,53,54],{},"LAWS Lambdaのコンポーネントを検索し、追加する。",[10,56,58],{"id":57},"準備",[59,60,57],"strong",{},[47,62,63,66,69],{},[25,64,65],{},"AWSのアカウント",[25,67,68],{},"作業用ローカルPC OS – Windows, Linux, and macOS",[25,70,71],{},"VS Code version 1.31.1またはそれ以降",[15,73,74],{},[59,75,76],{},"推奨",[47,78,79,88],{},[25,80,81,82,87],{},"AWS SAM CLI – サーバレスアプリケーション開発、テスト、分析をローカルで行うのに役立ちします。 こちらはtoolkitに必須という訳ではありません。ただ、こちらとDockerをインストールすることをお勧めします。なぜなら様々なAWS Serverless Application Model (AWS SAM)で必要であり、サーバレスアプリケーションの色々な機能を使うことができます。AWS SAM CLIのインストールについては ",[29,83,86],{"href":84,"rel":85},"https:\u002F\u002Fdocs.aws.amazon.com\u002Fserverless-application-model\u002Flatest\u002Fdeveloperguide\u002Fserverless-sam-cli-install.html",[33],"こちら","を確認してください。",[25,89,90],{},"Docker – AWS SAM CLIを使用する場合は必須です。",[10,92,94],{"id":93},"インストール",[59,95,93],{},[47,97,98,115,118],{},[25,99,100,101,106],{},"VScodeアプリケーションを開き、アクティブバーのExtensionアイコンを選択してください。その後、“AWS Toolkit for Visual Studio Code”を検索してください。 参考 Vscode websiteからtoolkitをインストールすることもできます。",[29,102,105],{"href":103,"rel":104},"https:\u002F\u002Fmarketplace.visualstudio.com\u002Fitems?itemName=AmazonWebServices.aws-toolkit-vscode",[33],"toolkitリンク",[107,108],"img",{"className":109,"alt":112,"src":113,"style":114},[110,111],"block","mx-auto","","https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06090446\u002Faws1.png","width: 70%;",[25,116,117],{},"インストールを選択します。",[25,119,120,121],{},"インストール後、リロードが要求されたらアプリケーションをリスタートする必要があります。インストールが成功していれば, AWSアイコンがアクティブバー内に表示されます。",[107,122],{"className":123,"alt":112,"src":124,"style":125},[110,111],"https:\u002F\u002Fbriswell-vn.com\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002Faws2-1.png","width: 100%;",[10,127,129],{"id":128},"aws-access-keysの取得",[59,130,131],{},"AWS Access Keysの取得",[15,133,134],{},"Access keysはアプリケーションからAWSサービスやリソースへのアクセスを許可させるかどうかの判断を行う情報になります。Access keysはAWSアカウントに関連づけられたもの”root user”もしくはAWS Identity and Access Management (IAM)として作成されアクセス許可を得たものになります。",[15,136,137],{},[59,138,139],{},"注意",[15,141,142,143,147],{},"“root user”は全てのサービスやリソースにアクセスできるユーザのためIAMを作成し、必要なタスクを行うために必要な権限を付与するようにすることをお勧めします。その時に、AWSアカウントユーザに関連づけられたアクセスキーをクレデンシャルとして使用します。 詳しくは",[29,144,86],{"href":145,"rel":146},"https:\u002F\u002Fdocs.aws.amazon.com\u002FIAM\u002Flatest\u002FUserGuide\u002Fid_users_create.html",[33],"を参照してください。",[10,149,151],{"id":150},"クレデンシャルプロファイルの作成",[59,152,150],{},[47,154,155,158,165,176,183,190],{},[25,156,157],{},"VSCodeを開く",[25,159,160,161,164],{},"Ctrl + Shift + P (open ",[59,162,163],{},"Command Palette",")を押下します。",[25,166,167,170,171],{},[59,168,169],{},"AWS: Create Credentials Profile","を検索し選択します。",[107,172],{"className":173,"alt":112,"src":174,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06090640\u002Faws3.png","width: 80%;",[25,177,178,179],{},"プロファイル名を入力します (ex: default).",[107,180],{"className":181,"alt":112,"src":182,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06090707\u002Faws4.png",[25,184,185,186],{},"access key IDを入力します。",[107,187],{"className":188,"alt":112,"src":189,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06090736\u002Faws5.png",[25,191,192,193],{},"secret keyを入力します。",[107,194],{"className":195,"alt":112,"src":182,"style":175},[110,111],[10,197,199,201],{"id":198},"aws-toolkit-for-visual-studio-codeを通してawsにアクセスします",[59,200,5],{},"を通してAWSにアクセスします。",[47,203,204,207,211,218],{},[25,205,206],{},"VScodeを開きます。",[25,208,160,209,164],{},[59,210,163],{},[25,212,213,214],{},"**AWS: Connect to AWS.**で検索します。",[107,215],{"className":216,"alt":112,"src":217,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06090848\u002Faws7.png",[25,219,220,221,225,226,229],{},"profileをリストから選択します。\n",[107,222],{"className":223,"alt":112,"src":224,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06090913\u002Faws8.png"," 右下の角に小さいポップアップウィンドウで接続確認が出た場合は、",[59,227,228],{},"Yes","を選択します。",[107,231],{"className":232,"alt":112,"src":233,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06090935\u002Faws9.png",[47,235,237],{"start":236},5,[25,238,239,240],{},"AWSに接続することができました。リージョンを選択することが可能になります。\n",[107,241],{"className":242,"alt":112,"src":243,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091018\u002Faws10.png",[10,245,247],{"id":246},"ローカルホスト内でのaws-samの環境作成",[59,248,249],{},"ローカルホスト内でのAWS SAMの環境作成",[15,251,252],{},[59,253,254],{},"必須事項:",[22,256,257,260,263,266],{},[25,258,259],{},"Administration権限を持ったIAMユーザ",[25,261,262],{},"Dockerのインストールおよび起動",[25,264,265],{},"AWS CLIとAWS SAMのインストール",[25,267,268],{},"AWS S3に使用できるバケット",[47,270,271,279,286,293,300,307,314],{},[25,272,273,274],{},"“Create new SAM Application”を選択します。",[107,275],{"className":276,"alt":112,"src":277,"style":278},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091122\u002Fdebug1-1.png","width: 50%;",[25,280,281,282],{},"SAM applicationで使用するプログラミング言語を選択します。",[107,283],{"className":284,"alt":112,"src":285,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091146\u002Fdebug2-1.png",[25,287,288,289],{},"新しいプロジェクトを保存するフォルダーを選択します。",[107,290],{"className":291,"alt":112,"src":292,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091205\u002Fdebug3-1.png",[25,294,295,296],{},"新しいプロジェクトの名前を入力します。",[107,297],{"className":298,"alt":112,"src":299,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091220\u002Fdebug4.png",[25,301,302,303],{},"これはSAMのサンプルです。",[107,304],{"className":305,"alt":112,"src":306,"style":278},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091250\u002Fdebug6.png",[25,308,309,310],{},"ローカル環境でmfile app.jsファイルを開き、AWS SAM applicationを動かすために”Run Locally”を選択します。",[107,311],{"className":312,"alt":112,"src":313,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091313\u002Fdebug7.png",[25,315,316,317],{},"その時、VSコードのタブの”OUTPUT”にAPIの結果が表示されます。",[107,318],{"className":319,"alt":112,"src":320,"style":125},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091324\u002Fdebug8-1024x525.png",[10,322,324],{"id":323},"ローカル環境でのaws-sam-applicationのデバッグ","ローカル環境でのAWS SAM Applicationのデバッグ",[15,326,327,328],{},"“Debug Locally”を選択します。その後debugで止め情報を見たいところのポイントを選択します。 ",[107,329],{"className":330,"alt":112,"src":331,"style":332},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091348\u002Fdebug9-1024x312.png","width: 95%;",[10,334,336],{"id":335},"aws-sam-applicationをaws上にデプロイする","AWS SAM ApplicationをAWS上にデプロイする",[47,338,339,346,353,360,367,374],{},[25,340,341,342],{},"“Deploy SAM Application”を選択します。",[107,343],{"className":344,"alt":112,"src":345,"style":278},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091409\u002Fdeploy1.png",[25,347,348,349],{},"AWSにデプロイするSAMのtemplateファイルを選択します。",[107,350],{"className":351,"alt":112,"src":352,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091445\u002Fdeploy2.png",[25,354,355,356],{},"デプロイするAWSのリージョンを選択します。",[107,357],{"className":358,"alt":112,"src":359,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091457\u002Fdeploy3.png",[25,361,362,363],{},"デプロイ先のS3バケット名を入力します。(このバケットはS3に存在しているものです。)",[107,364],{"className":365,"alt":112,"src":366,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091508\u002Fdeploy4.png",[25,368,369,370],{},"デプロイ先のstackの名前を入力します。",[107,371],{"className":372,"alt":112,"src":373,"style":175},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06094204\u002Fdeploy5.png",[25,375,376,377],{},"AWSへアップロードが成功したら、AWSエクスプローラ上で新しいCloudFormationとLambdaが表示されます。",[107,378],{"className":379,"alt":112,"src":380,"style":278},[110,111],"https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06091542\u002Fdeploy6.png",{"title":112,"searchDepth":382,"depth":382,"links":383},2,[384,386,387,388,389,390,392,393,394],{"id":12,"depth":385,"text":13},3,{"id":57,"depth":385,"text":57},{"id":93,"depth":385,"text":93},{"id":128,"depth":385,"text":131},{"id":150,"depth":385,"text":150},{"id":198,"depth":385,"text":391},"AWS Toolkit for Visual Studio Codeを通してAWSにアクセスします。",{"id":246,"depth":385,"text":249},{"id":323,"depth":385,"text":324},{"id":335,"depth":385,"text":336},"teck talk","Briswell Vietnam Co Ltd","2019-09-20","AWS Toolkit この拡張サービスは開発者にとってAmazon Web Services (AWS)のサーバレスアプリケーションの開発\u002Fデバッグをローカルで行うのに役立てくれます。","md",{},true,"\u002Fja\u002Fnews\u002Faws-toolkit-for-visual-studio-code",null,{"title":5,"description":398},"ja\u002Fnews\u002Faws-toolkit-for-visual-studio-code","https:\u002F\u002Fs3-ap-southeast-1.amazonaws.com\u002Fhomepage-media\u002Fwp-content\u002Fuploads\u002F2019\u002F09\u002F06090408\u002Fawstoolkit_vscode-1.png","Oer27ATGyo0OD1Ap6OwEAxxLJ_nKLRVnTny8Lbr22sI",1783674946011]