Як запустити сайт на AWS безкоштовно за 15 хвилин

Якщо ви абсолютно новачок у веб-сервісах Amazon (AWS), це може виявитися надзвичайно складним.

Не тільки здається, що на вибір є тисяча різних служб, кожна з яких має настільки ж загадкове ім’я (як S3, Lambda, EC2 або Athena), але існує також так багатоналаштувати.

Вам потрібно вирішити, скільки пам’яті виділити для ваших функцій, з якого географічного регіону світу ви хочете обслуговувати свій код, і вам потрібно створити дивний об’єкт JSON, щоб надати дозволи? ДІЙСНО легко занурити пальці ніг і вирішити, що це занадто заплутано, щоб розпочати.

Якщо це описує ваш досвід на сьогоднішній день, то добре - ця стаття для вас.

Я сидів у точно такому ж човні довше, ніж хотів би визнати.

Але, незважаючи на всю його страшну складність, у AWS є щось, що просто продовжує телефонувати вам.

Існує швидкість, надійність, навіть просто професійна сила того, що ви можете сказати, що у вас є досвід роботи з AWS.

Але, як і в усьому, якщо ви хочете розпочати роботу, то вам потрібно зробити перший крок. Тож моя мета у цій статті - зробити це легким. Я хочу довести вас до того, що ви можете сказати: "Я розгорнув проект на AWS".

Це буде набагато простіше, ніж ви думаєте, і це дасть вам момент, з якого ви почнете вивчати інші послуги AWS.

Крок 0: Те, що вам потрібно буде дотримуватися

Список короткий, але я вирішив поставити його спереду та по центру, щоб переконатися, що він зрозумілий з самого початку.

  1. Працююча кредитна / дебетова картка (не хвилюйтеся, все безкоштовно, як сказано в назві. Але для створення облікового запису AWS вам потрібно буде ввести дані кредитної картки)
  2. Фронтальний код, який ви можете завантажити та розмістити на AWS. Це може бути так просто, як HTML-документ за допомогою

    Hello World

    в організмі.

Крок 1: Створіть обліковий запис AWS

Чесно кажучи, я зупинявся на цьому етапі кілька разів просто тому, що це була одна з ситуацій "безкоштовного пробного періоду, але вони просять надати інформацію про вашу кредитну картку", яким я, як правило, в принципі противлюю.

Але 12-місячний безкоштовний рівень досить дивовижний. Повний рік - це довгий час, щоб мати можливість експериментувати на AWS, перш ніж вирішити, чи варто продовжувати використовувати його. (Я жодним чином не пов'язаний з AWS, лише для запису).

Тож переходьте за цим посиланням і створіть свій рахунок: Безкоштовний рівень AWS.

Я знаю, що деякі люди можуть хвилюватись щодо обмежень на безкоштовний план. Наприклад, існує щомісячне обмеження на запити GET та PUT (20 000 та 2000 відповідно), після чого ви починаєте отримувати плату.

Але поки ви використовуєте це лише для експериментів та навчання поки що, майже немає шансів перевищити обмеження.

Навіть якщо ви це зробите, ціна на перевищення обмежень зазвичай становить частку копійки за 1000 запитів.

Крок 2: Створіть сегмент S3 для вашого проекту / сайту

Щоб зробити речі максимально простими, єдиною службою AWS, яку ми будемо використовувати для цього проекту, буде Simple Storage Service (або S3), одна з хмарних служб зберігання Amazon.

S3 поводиться трохи як Google Drive або Dropbox. Але його також можна налаштувати для обслуговування файлів, а не просто для їх зберігання, що ми і будемо робити.

Оскільки ми просто обслуговуватимемо файли, розміщені на S3, це буде статичний сайт, без серверної бази та підключень до бази даних.

Тепер, коли у вас є обліковий запис AWS, увійдіть до консолі керування (зв’язана тут) і натисніть «Послуги» у верхньому лівому куті головного меню.

Ви побачите той приголомшливий великий перелік варіантів послуг, про який я згадував на початку. Не хвилюйтеся про все це, просто натисніть на “S3” у розділі “Зберігання”.

Це перенесе вас на сторінку S3, де ви можете створити різні “відра” для зберігання своїх різних проектів.

Відра - це як папки на робочому столі. Але система зберігання документів на S3 не відповідає традиційній структурі папок (більше про це, якщо вам цікаво). Тож замість цього, "відро", здається, є правильним словом для вживання.

Клацніть на велику синю кнопку у верхньому лівому куті під назвою "Створити сегмент", щоб створити сегмент, який міститиме файли вашого проекту.

Головне, що вам потрібно зробити тут, переконайтеся, що для загальнодоступних дозволів встановлено значення «Надати доступ для загального доступу до цього сегмента».

Ви отримаєте попередження від AWS, але не хвилюйтеся. Вони просто хочуть переконатися, що ніхто не міг зробити це випадково. Але це саме те, що ви хочете зробити.

Закінчивши, ви побачите свій сегмент у списку на консолі S3.

Крок 3: Додайте файли та налаштуйте параметри у вашому сегменті

Клацніть на новоствореному сегменті у списку. Це призведе до сторінки, де ви можете додати вміст у відро та налаштувати його налаштування.

По-перше, ви захочете додати свої файли проекту (згадані на початку) на вкладці “Огляд”. Пам’ятайте, це можуть бути файли для будь-якого функціонуючого інтерфейсного проекту.

Ви не зможете завантажити жодних папок (знову ж таки, оскільки S3 насправді не має структури папок). Натомість вам потрібно буде вручну створити будь-які папки, які є у вашому проекті в S3, і завантажити до них файли.

Далі натисніть на вкладку “Властивості”.

Тут ви скажете S3, що хочете використовувати цей сегмент для розміщення своїх файлів.

Просто натисніть на плитку, на якій написано «Статичний хостинг веб-сайтів», і введіть імена вашого індексу (обов’язково) та документів про помилку (не потрібно), і все готово.

Потім натисніть на вкладку “Дозволи”.

Під основними вкладками, які ви починаєте, ви побачите у підрозділі «Список контролю доступу». Це вже налаштовано правильно, оскільки ви вже сказали, що будь-хто повинен мати можливість читати файли, розміщені в цьому сегменті.

Now you’ll need to click on the “Bucket Policy” subsection. Here, you’ll be prompted to create a JSON object that contains the details of your bucket’s access permission policy.

This part can be confusing. For now, I’ll just give you the JSON that will grant full public access to the files in your bucket. This will make the website publicly accessible.

Paste this into the bucket policy editor shown above:

{ "Version": "2012-10-17", "Statement": [ { "Sid": "PublicReadForGetBucketObjects", "Effect": "Allow", "Principal": "*", "Action": "s3:GetObject", "Resource": "arn:aws:s3:::YOUR-BUCKET-NAME/*" } ]}

Don’t forget to replace “YOUR-BUCKET-NAME” with… your bucket’s name.

You’re done!

That’s it! You have now deployed a very simple static site on AWS S3.

To access your site, go back to the “Overview” tab on S3 and click on your index document (click on a blank area in the list item, not on the link to the document itself). You’ll get a slide-in menu on the right with a link to your site!