В статті "Встановлення необхідних програм" ми з'ясуємо, які інструменти потрібні для веб-розробки та як їх правильно встановити.
Які інструменти використовують професіонали?
- Комп'ютер. Це надто очевидно, проте хтось може читати статтю з телефону чи комп'ютера в бібліотеці. Для серйозної веб-розробки краще мати власний комп'ютер чи ноутбук з операційною системою Windows, Mac або Linux.
- Текстовий редактор для написання коду. Це такі текстові редактори, як: SublimeText, Brackets, Atom або Visual Studio Code чи гібридні, як-от: Dreamweaver або WebStorm). Офісні програми (наприклад, MS Office) не відповідають вимогам, тому що вставляють в документ приховані елементи, які можуть вплинути на зчитування документу браузером.
- Веб-браузер для тестування коду. Наразі, найвживанішими є Firefox, Chrome, Opera, Safari, Internet Explorer та Microsoft Edge. Ви повинні тестувати, як сайт відображається на мобільних пристроях та старих браузерах, які ваша цільова аудиторія може використовувати (як-от IE 8–10).
- Графічний редактор, як-от: GIMP, Paint.NET чи Photoshop щоб створити зображення для сайту.
- Система контролю версій для управління файлами на серверах, співпраці з командою, поширення коду і уникнення розбіжностей при редагуванні. Наразі Git є найбільш визнаним інструментом контролю версій так само хостинг кодів GitHub, що базується на Git.
- Програма FTP, якою користуються на старих веб-хостингах для управління файлами на серверах (Git в цьому поступово витісняє FTP). Існує багато (S)FTP-програм, як-от Cyberduck, Fetch і FileZilla.
- Система автоматизації, наприклад, Grunt чи Gulp для автоматичного виконання повторюваних завдань, таких як зменшення коду чи виконання тестів.
- Шаблони, бібліотеки, фреймворки для швидшого написання поширених частин коду.
- А також багато іншого!
Які інструменти мені потрібні зараз?
Список виглядає страшно, але на щастя ви можете починати веб-розробку без знань більшості з них. У статті розглянемо базовий мінімум — текстовий редактор і кілька сучасних браузерів.
Встановлення текстового редактора
Напевно, у вас вже є простий текстовий редактор на комп'ютері. Windows зазвичай має Notepad, а macOS — TextEdit. Linux пропонує різні варіанти, зокрема Ubuntu має gedit.
Для веб-розробки доступні кращі редактори, ніж Notepad чи TextEdit. Пропонуємо Brackets —безкоштовний редактор з підказками та попереднім переглядом.
Встановлення сучасного браузера
Встановимо кілька браузерів, щоб тестувати наш код. Оберіть операційну систему, клацніть відповідне посилання та завантажте улюблені браузери:
- Linux: Firefox, Chrome, Opera.
- Windows: Firefox, Chrome, Opera, Internet Explorer, Microsoft Edge (Windows 10 зазвичай має Edge; в Windows 7 і вище можете встановити Internet Explorer 11; для решти — інший браузер).
- Mac: Firefox, Chrome, Opera, Safari (Safari зазвичай є в iOS і macOS)
Перед тим, як продовжити, встановіть принаймні два з цих браузерів і запустіть їх.
Internet Explorer не сумісний з деякими сучасними функціями вебу та, вірогідно, не зможе запустити ваш проект. Зазвичай вам не потрібно турбуватися про те, щоб зробити свої веб-проекти сумісними з ним, оскільки дуже мало людей все ще користуються ним - тож, не надто переймайтеся про це, поки ви навчаєтесь. Іноді ви можете зіткнутися з проектом, який потребує його підтримки.
Встановлення локального веб-сервера
Деякі приклади потрібно буде тестувати на локальному веб-сервері. Ви можете дізнатися, як його встановити, у статті Як ти налаштуєш локальний тестовий сервер?