{"id":82,"date":"2019-07-01T00:10:35","date_gmt":"2019-06-30T15:10:35","guid":{"rendered":"https:\/\/blog.hacya.com\/?p=82"},"modified":"2021-07-04T14:58:17","modified_gmt":"2021-07-04T05:58:17","slug":"reactstaticwebhosting2","status":"publish","type":"post","link":"https:\/\/blog.hacya.com\/index.php\/2019\/07\/01\/reactstaticwebhosting2\/","title":{"rendered":"React\u3092\u4f7f\u3063\u3066Static\u306aWeb Hosting\u3092\u3059\u308b\u3002(\u305d\u306e2)"},"content":{"rendered":"\n<p>\u305d\u308c\u3067\u306f\u3001\u524d\u56de\u4f5c\u6210\u3057\u305fReact\u306eSample Page\u3092AWS S3\u306bDeploy\u3057\u307e\u3057\u3087\u3046\u3002<br>AWS S3\u306bDeploy\u3059\u308b\u969b\u3001AWS\u306eManagement Console\u304b\u3089Web Page\u3092\u69cb\u6210\u3059\u308bJava Script File\u3092\u4e00\u3064\u4e00\u3064Upload\u3059\u308b\u306e\u306f\u73fe\u5b9f\u7684\u3067\u306f\u3042\u308a\u307e\u305b\u3093\u3002Command Line\u304b\u3089Command\u4e00\u767a\u3067\u3001\u76f4\u63a5Upload\u3057\u305f\u3044\u3067\u3059\u3088\u306d\u3002\u305d\u3053\u3067\u3001AWS\u306eCLI(Command Line Interface)\u3092\u4f7f\u3063\u3066Upload\u3059\u308b\u3053\u3068\u306b\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p>\u307e\u305a\u3001AWS\u4e0a\u306bS3\u3078\u306eUpload\u6a29\u9650\u3092\u3082\u3064IAM (Identity and Access Management) User\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002AWS\u3067\u306f\u3001\u3053\u306e\u3088\u3046\u306a\u6a29\u9650\u7ba1\u7406\u304c\u5fb9\u5e95\u3057\u3066\u3044\u3066\u3001\u5f37\u976d\u306aSystem\u3092\u69cb\u6210\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002\u305d\u306e\u53cd\u9762\u3001\u8a2d\u5b9a\u304c\u7169\u96d1\u306b\u306a\u308a\u3001\u96e3\u89e3\u3067\u53d6\u3063\u3064\u304d\u306b\u304f\u3044\u5370\u8c61\u3092\u6301\u305f\u308c\u3066\u3044\u308b\u3088\u3046\u306b\u611f\u3058\u307e\u3059\u3002\u305d\u308c\u306f\u3055\u3066\u304a\u304d\u3001AWS Management Console\u304b\u3089IAM Service\u3092\u547c\u3073\u51fa\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p>IAM\u306e\u300c\u30c0\u30c3\u30b7\u30e5\u30dc\u30fc\u30c9\u300d\u304b\u3089\u3001\u300c\u30e6\u30fc\u30b6\u300d\u3092\u30af\u30ea\u30c3\u30af\u3001\u300c\u30e6\u30fc\u30b6\u3092\u8ffd\u52a0\u300d\u3092\u30af\u30ea\u30c3\u30af\u3057\u3066\u30e6\u30fc\u30b6\u306e\u8ffd\u52a0\u3092\u884c\u3044\u307e\u3059\u3002\u30e6\u30fc\u30b6\u540d\u3092\u300cS3UploadUser\u300d\u3068\u3057\u3066\u3001\u30a2\u30af\u30bb\u30b9\u306e\u7a2e\u985e\u306f\u300c \u30d7\u30ed\u30b0\u30e9\u30e0\u306b\u3088\u308b\u30a2\u30af\u30bb\u30b9 \u300d\u3092\u30c1\u30a7\u30c3\u30af\u3057\u307e\u3059\u3002\u300c AWS \u30de\u30cd\u30b8\u30e1\u30f3\u30c8\u30b3\u30f3\u30bd\u30fc\u30eb\u3078\u306e\u30a2\u30af\u30bb\u30b9 \u300d\u306f\u3001\u3053\u306e\u30e6\u30fc\u30b6\u3067Management Console\u306bLogin\u3059\u308b\u3053\u3068\u306f\u7121\u3044\u306e\u3067\u3001\u30c1\u30a7\u30c3\u30af\u3057\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser0-edit-1-1024x576.png\" alt=\"\" class=\"wp-image-95\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser0-edit-1-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser0-edit-1-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser0-edit-1-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser0-edit-1-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser0-edit-1.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser1-edit-1-1024x576.png\" alt=\"\" class=\"wp-image-96\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser1-edit-1-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser1-edit-1-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser1-edit-1-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser1-edit-1-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser1-edit-1.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser2-edit-1024x576.png\" alt=\"\" class=\"wp-image-97\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser2-edit-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser2-edit-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser2-edit-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser2-edit-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser2-edit.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<p>\u300c\u30a2\u30af\u30bb\u30b9\u8a31\u53ef\u306e\u8a2d\u5b9a\u300d\u3067\u306f\u3001\u300c\u65e2\u5b58\u306e\u30dd\u30ea\u30b7\u30fc\u3092\u76f4\u63a5\u30a2\u30bf\u30c3\u30c1\u300d\u3092\u30af\u30ea\u30c3\u30af\u3057\u3001\u300c\u30dd\u30ea\u30b7\u30fc\u306e\u30d5\u30a3\u30eb\u30bf\u300d\u306b\u300cS3\u300d\u3092\u5165\u529b\u3057\u3001S3\u95a2\u9023\u306ePolicy\u3092\u8868\u793a\u3055\u305b\u307e\u3059\u3002\u3053\u306e\u4e2d\u304b\u3089\u3001\u300cAmazonS3FullAccess\u300d\u3092\u30c1\u30a7\u30c3\u30af\u3057\u3066\u3001 \u300cS3UploadUser\u300d \u306b\u6a29\u9650\u3092\u4e0e\u3048\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser3-1024x576.png\" alt=\"\" class=\"wp-image-98\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser3-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser3-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser3-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser3-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser3.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<p>\u5f8c\u3005\u3001\u7ba1\u7406\u3057\u3084\u3059\u3044\u3088\u3046\u306b\u30bf\u30b0\u3092\u4ed8\u3051\u3066\u304a\u304d\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser4-1024x576.png\" alt=\"\" class=\"wp-image-99\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser4-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser4-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser4-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser4-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser4.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<p>\u5185\u5bb9\u3092\u78ba\u8a8d\u3057\u3066\u3001\u300c\u30e6\u30fc\u30b6\u306e\u4f5c\u6210\u300d\u3092\u30af\u30ea\u30c3\u30af\u3057\u3066\u30e6\u30fc\u30b6\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002\u30e6\u30fc\u30b6\u304c\u4f5c\u6210\u3055\u308c\u305f\u3089\u3001\u5fc5\u305a\u300c.csv\u306e\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u300d\u3092\u30af\u30ea\u30c3\u30af\u3057\u3066\u3001.csv\u3092\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3057\u3066\u4fdd\u5b58\u3057\u3066\u304f\u3060\u3055\u3044\u3002AWS CLI\u304b\u3089AWS\u3078\u306e\u30a2\u30af\u30bb\u30b9\u3059\u308b\u969b\u306b\u3001.csv\u306b\u4fdd\u5b58\u3055\u308c\u3066\u3044\u308b\u30a2\u30af\u30bb\u30b9\u30ad\u30fcID\u3068\u30b7\u30fc\u30af\u30ec\u30c3\u30c8\u30a2\u30af\u30bb\u30b9\u30ad\u30fc\u3092\u4f7f\u3063\u3066\u8a8d\u8a3c\u3092\u884c\u3044\u307e\u3059\u3002\u3053\u306e\u30ad\u30fc\u30da\u30a2\u30fc\u304c\u5916\u90e8\u306b\u6f0f\u308c\u308b\u3068\u3001\u5916\u90e8\u304b\u3089AWS\u3078\u30a2\u30af\u30bb\u30b9\u3057\u60aa\u7528\u3055\u308c\u308b\u53ef\u80fd\u6027\u304c\u3042\u308b\u305f\u3081\u3001\u5916\u90e8\u306b\u6f0f\u308c\u306a\u3044\u3088\u3046\u306b\u7ba1\u7406\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser5-1024x576.png\" alt=\"\" class=\"wp-image-100\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser5-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser5-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser5-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser5-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser5.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser6-edit-1-1024x576.png\" alt=\"\" class=\"wp-image-101\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser6-edit-1-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser6-edit-1-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser6-edit-1-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser6-edit-1-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser6-edit-1.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/credentials-edit-1024x576.png\" alt=\"\" class=\"wp-image-93\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/credentials-edit-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/credentials-edit-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/credentials-edit-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/credentials-edit-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/credentials-edit.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<p>\u4f5c\u6210\u3057\u305f\u30e6\u30fc\u30b6\u3092\u78ba\u8a8d\u3057\u307e\u3057\u3087\u3046\u3002\u4f5c\u6210\u3057\u305f\u30e6\u30fc\u30b6\u540d\u3092\u30af\u30ea\u30c3\u30af\u3059\u308b\u3068\u3001\u300c\u6982\u8981\u300d\u306e\u300c\u30a2\u30af\u30bb\u30b9\u6a29\u9650\u300d\u30bf\u30d6\u306b\u8a31\u53ef\u3055\u308c\u3066\u3044\u308b\u6a29\u9650\u304c\u8868\u793a\u3055\u308c\u307e\u3059\u3002\u300c\u8a8d\u8a3c\u60c5\u5831\u300d\u30bf\u30d6\u3092\u30af\u30ea\u30c3\u30af\u3057\u3066\u3001\u300c\u30b5\u30a4\u30f3\u30a4\u30f3\u8a8d\u8a3c\u60c5\u5831\u300d\u306e\u300c\u30b3\u30f3\u30bd\u30fc\u30eb\u30d1\u30b9\u30ef\u30fc\u30c9\u300d\u304c\u7121\u52b9\u306b\u306a\u3063\u3066\u3044\u308b\u3053\u3068\u3092\u78ba\u8a8d\u3057\u307e\u3059\u3002\u307e\u305f\u3001\u300c\u30a2\u30af\u30bb\u30b9\u30ad\u30fc\u300d\u306b\u300c\u30a2\u30af\u30bb\u30b9\u30ad\u30fcID\u300d\u304c\u3042\u308b\u3053\u3068\u3092\u78ba\u8a8d\u3057\u307e\u3059\u3002\u3053\u306e\u30a2\u30af\u30bb\u30b9\u30ad\u30fcID\u306b\u5bfe\u5fdc\u3059\u308b\u30b7\u30fc\u30af\u30ec\u30c3\u30c8\u30a2\u30af\u30bb\u30b9\u30ad\u30fc\u306f\u3001\u5148\u307b\u3069\u4fdd\u5b58\u3057\u305f.csv\u306b\u3042\u308a\u307e\u3059\u3002\u3082\u3057\u7d1b\u5931\u3057\u305f\u5834\u5408\u306f\u3001\u7d1b\u5931\u3057\u305f\u30a2\u30af\u30bb\u30b9\u30ad\u30fcID\u3092\u7121\u52b9\u5316\u3057\u3001\u518d\u5ea6\u3053\u306e\u753b\u9762\u304b\u3089\u300c\u30a2\u30af\u30bb\u30b9\u30ad\u30fc\u306e\u4f5c\u6210\u300d\u3092\u884c\u3046\u3053\u3068\u3067\u518d\u4f5c\u6210\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser7-edit-1-1024x576.png\" alt=\"\" class=\"wp-image-102\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser7-edit-1-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser7-edit-1-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser7-edit-1-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser7-edit-1-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser7-edit-1.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser8-edit-1-1024x576.png\" alt=\"\" class=\"wp-image-103\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser8-edit-1-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser8-edit-1-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser8-edit-1-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser8-edit-1-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser8-edit-1.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser9-edit-1-1024x576.png\" alt=\"\" class=\"wp-image-104\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser9-edit-1-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser9-edit-1-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser9-edit-1-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser9-edit-1-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/IAMUser9-edit-1.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<p>\u6b21\u306fAWS CLI\u306eInstall\u3067\u3059\u3002<br><a href=\"https:\/\/docs.aws.amazon.com\/ja_jp\/cli\/latest\/userguide\/install-windows.html\">https:\/\/docs.aws.amazon.com\/ja_jp\/cli\/latest\/userguide\/install-windows.html<\/a><br>\u3092\u53c2\u8003\u306bInstall\u3057\u307e\u3059\u3002\u4eca\u56de\u306f\u3001\u300c <a rel=\"noreferrer noopener\" href=\"https:\/\/s3.amazonaws.com\/aws-cli\/AWSCLI64PY3.msi\" target=\"_blank\">Windows (64 \u30d3\u30c3\u30c8) \u7528 \u306e AWS CLI MSI \u30a4\u30f3\u30b9\u30c8\u30fc\u30e9\u306e\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9<\/a> \u300d\u3092\u4f7f\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI1-1024x576.png\" alt=\"\" class=\"wp-image-105\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI1-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI1-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI1-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI1-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI1.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<p>Download\u304c\u5b8c\u4e86\u3057\u305f\u3089\u3001AWSCLI64PY3.msi\u3092\u30c0\u30d6\u30eb\u30af\u30ea\u30c3\u30af\u3057\u3066Install\u3057\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"618\" height=\"483\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI2.png\" alt=\"\" class=\"wp-image-106\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI2.png 618w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI2-300x234.png 300w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 984px) 61vw, (max-width: 1362px) 45vw, 600px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"618\" height=\"483\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI3.png\" alt=\"\" class=\"wp-image-107\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI3.png 618w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI3-300x234.png 300w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 984px) 61vw, (max-width: 1362px) 45vw, 600px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"618\" height=\"483\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI4.png\" alt=\"\" class=\"wp-image-108\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI4.png 618w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI4-300x234.png 300w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 984px) 61vw, (max-width: 1362px) 45vw, 600px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"618\" height=\"483\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI5.png\" alt=\"\" class=\"wp-image-109\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI5.png 618w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI5-300x234.png 300w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 984px) 61vw, (max-width: 1362px) 45vw, 600px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"618\" height=\"483\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI6.png\" alt=\"\" class=\"wp-image-110\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI6.png 618w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI6-300x234.png 300w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 984px) 61vw, (max-width: 1362px) 45vw, 600px\" \/><\/figure>\n\n\n\n<p>Install\u304c\u5b8c\u4e86\u3057\u305f\u3089\u3001AWS CLI\u306e\u8a2d\u5b9a\u3092\u884c\u3044\u307e\u3059\u3002<br><code>aws configure<\/code><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"535\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI7-edit-1024x535.png\" alt=\"\" class=\"wp-image-112\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI7-edit-1024x535.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI7-edit-300x157.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI7-edit-768x401.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI7-edit-1200x627.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI7-edit.png 1223w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<p>\u3053\u3053\u3067\u3001\u5148\u307b\u3069\u4fdd\u5b58\u3057\u305f\u30a2\u30af\u30bb\u30b9\u30ad\u30fcID\u3068\u30b7\u30fc\u30af\u30ec\u30c3\u30c8\u30a2\u30af\u30bb\u30b9\u30ad\u30fc\u3092\u5165\u529b\u3057\u307e\u3059\u3002Region\u306f\u3001ap-northeast-1(\u6771\u4eac)\u3092\u6307\u5b9a\u3001Output format\u306fjson\u3092\u6307\u5b9a\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"535\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI8-edit-1024x535.png\" alt=\"\" class=\"wp-image-113\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI8-edit-1024x535.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI8-edit-300x157.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI8-edit-768x401.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI8-edit-1200x627.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/06\/AWSCLI8-edit.png 1223w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<p>\u3053\u308c\u3067\u74b0\u5883\u8a2d\u5b9a\u306f\u5b8c\u4e86\u3067\u3059\u3002<\/p>\n\n\n\n<p> \u6b21\u306bReact\u306e\u8a2d\u5b9a\u3092\u5909\u66f4\u3057\u307e\u3059\u3002 \u524d\u56deexport\u3068\u3044\u3046\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306bReact\u306eApplication\u3092\u4f5c\u6210\u3057\u307e\u3057\u305f\u3002export\u306e\u76f4\u4e0b\u306bpackage.json\u30d5\u30a1\u30a4\u30eb\u304c\u3042\u308a\u307e\u3059\u3002AWS S3\u306bUpload\u3057\u3066Web Application\u3092\u69cb\u6210\u3059\u308b\u5834\u5408\u3001AWS S3\u306eURL\u3092\u6307\u5b9a\u3057\u3066Build\u3059\u308b\u5fc5\u8981\u304c\u3042\u308b\u305f\u3081\u3001&#8221;homepage&#8221;\u3068\u3044\u3046\u30a8\u30f3\u30c8\u30ea\u3092\u8ffd\u52a0\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism undefined-numbers lang-json\" data-lang=\"JSON\" data-file=\"package.json\"><code>{\n  &quot;name&quot;: &quot;export&quot;,\n  &quot;version&quot;: &quot;0.1.0&quot;,\n  &quot;private&quot;: true,\n  &quot;homepage&quot; : &quot;https:\/\/s3-ap-northeast-1.amazonaws.com\/export.hacya.com &quot;,\n  &quot;dependencies&quot;: {\n    &quot;react&quot;: &quot;^16.8.6&quot;,\n    &quot;react-dom&quot;: &quot;^16.8.6&quot;,\n    &quot;react-scripts&quot;: &quot;3.0.1&quot;\n  },\n  &quot;scripts&quot;: {\n    &quot;start&quot;: &quot;react-scripts start&quot;,\n    &quot;build&quot;: &quot;react-scripts build&quot;,\n    &quot;test&quot;: &quot;react-scripts test&quot;,\n    &quot;eject&quot;: &quot;react-scripts eject&quot;\n  },\n  &quot;eslintConfig&quot;: {\n    &quot;extends&quot;: &quot;react-app&quot;\n  },\n  &quot;browserslist&quot;: {\n    &quot;production&quot;: [\n      &quot;&gt;0.2%&quot;,\n      &quot;not dead&quot;,\n      &quot;not op_mini all&quot;\n    ],\n    &quot;development&quot;: [\n      &quot;last 1 chrome version&quot;,\n      &quot;last 1 firefox version&quot;,\n      &quot;last 1 safari version&quot;\n    ]\n  }\n}<\/code><\/pre><\/div>\n\n\n\n<p>Web Application\u3092Build\u3057\u307e\u3059\u3002\u7d50\u679c\u306f\u3001build\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u4f5c\u6210\u3055\u308c\u307e\u3059\u3002<br><code>cd export<\/code><br><code>npm run build<\/code><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"535\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy1-edit-1024x535.png\" alt=\"\" class=\"wp-image-114\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy1-edit-1024x535.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy1-edit-300x157.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy1-edit-768x401.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy1-edit-1200x627.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy1-edit.png 1223w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<p>\u4f5c\u6210\u3057\u305fWeb Application\u3092AWS S3\u306bDeploy\u3057\u307e\u3059\u3002\u3053\u3053\u3067\u3001\u5148\u306bInstall\u3057\u305fAWS CLI\u3092\u4f7f\u3044\u307e\u3059\u3002AWS S3 Sync\u3092\u4f7f\u3063\u3066\u3001S3\u306bCode\u3092Upload\u3057\u307e\u3059\u3002<br><code>aws s3 sync --exact-timestamps --delete --acl public-read <em>dirname<\/em> <em>bucketname<\/em><\/code><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"535\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy2-edit-1024x535.png\" alt=\"\" class=\"wp-image-115\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy2-edit-1024x535.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy2-edit-300x157.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy2-edit-768x401.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy2-edit-1200x627.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy2-edit.png 1223w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<p>Upload\u304c\u5b8c\u4e86\u3057\u305f\u3089\u3001index.html\u306e\u6642\u3068\u540c\u3058\u3088\u3046\u306bWeb Browser\u304b\u3089Access\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002React\u3092Local\u3067\u5b9f\u884c\u3057\u305f\u6642\u3068\u540c\u3058\u753b\u9762\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy3-1024x576.png\" alt=\"\" class=\"wp-image-116\" srcset=\"https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy3-1024x576.png 1024w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy3-300x169.png 300w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy3-768x432.png 768w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy3-1200x675.png 1200w, https:\/\/blog.hacya.com\/wp-content\/uploads\/2019\/07\/deploy3.png 1920w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<p>\u3053\u308c\u3067\u3001\u5c11\u3057\u8907\u96d1\u306aStatic Web Application\u3092AWS S3\u3092\u4f7f\u3063\u3066\u516c\u958b\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u308b\u3053\u3068\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u305d\u308c\u3067\u306f\u3001\u524d\u56de\u4f5c\u6210\u3057\u305fReact\u306eSample Page\u3092AWS S3\u306bDeploy\u3057\u307e\u3057\u3087\u3046\u3002AWS S3\u306bDeploy\u3059\u308b\u969b\u3001AWS\u306eManagement Console\u304b\u3089Web Page\u3092\u69cb\u6210\u3059\u308bJava Scr &hellip; <a href=\"https:\/\/blog.hacya.com\/index.php\/2019\/07\/01\/reactstaticwebhosting2\/\" class=\"more-link\"><span class=\"screen-reader-text\">&#8220;React\u3092\u4f7f\u3063\u3066Static\u306aWeb Hosting\u3092\u3059\u308b\u3002(\u305d\u306e2)&#8221; \u306e<\/span>\u7d9a\u304d\u3092\u8aad\u3080<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[4,18,8,19,5,6,7,16],"class_list":["post-82","post","type-post","status-publish","format-standard","hentry","category-aws","tag-aws","tag-cli-2","tag-create-react-app","tag-iam-2","tag-node-js","tag-npm","tag-react","tag-s3-2"],"_links":{"self":[{"href":"https:\/\/blog.hacya.com\/index.php\/wp-json\/wp\/v2\/posts\/82","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.hacya.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.hacya.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.hacya.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.hacya.com\/index.php\/wp-json\/wp\/v2\/comments?post=82"}],"version-history":[{"count":4,"href":"https:\/\/blog.hacya.com\/index.php\/wp-json\/wp\/v2\/posts\/82\/revisions"}],"predecessor-version":[{"id":146,"href":"https:\/\/blog.hacya.com\/index.php\/wp-json\/wp\/v2\/posts\/82\/revisions\/146"}],"wp:attachment":[{"href":"https:\/\/blog.hacya.com\/index.php\/wp-json\/wp\/v2\/media?parent=82"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.hacya.com\/index.php\/wp-json\/wp\/v2\/categories?post=82"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.hacya.com\/index.php\/wp-json\/wp\/v2\/tags?post=82"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}