Розробка html5-проектів в netbeans

Чому в цій статті розглядаються саме - і тільки - проекти на HTML5. адже NetBeans дозволяє вести розробку на великій кількості інших мов програмування?

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

Друга причина випливає з першої. Одночасно з розвитком самої технології розвиваються і інструменти програмування для неї, в них постійно реалізуються нові цікаві підходи і прийоми; різні середовища розробки активно змагаються один з одним, і потрібно тримати цей процес під контролем, щоб залишатися на передньому краї нових технологічних можливостей.


Установка модифікацій (updates) компонент NetBeans

Час від часу як для встановлених модулів, так і для ядра NetBeans з'являються нові версії - updates. Їх встановлення та підключення робиться дуже просто.

Перш за все, потрібно звернути увагу на індикатор наявності модифікацій, розташований в рядку стану (Status line) NetBeans (нижня рядок на екрані).

Мал. 1. Індикатор модифікацій в рядку стану

Як видно, надійшло повідомлення про наявність 9 модифікацій в NetBeans. Щоб завантажити і встановити їх, потрібно просто клікнути по посиланню в правому вікні і далі слідувати вказівкам інсталятора. Після того, як модифікації будуть встановлені, вам буде запропоновано перезавантажити NetBeans, і після перезавантаження ви будете використовувати середу останньої версії.

Як вже говорилося, виділена підтримка розробки HTML5 додатків у вигляді самостійних проектів вперше була реалізована в NetBeans версії 7.3.

NetBeans дозволяє одночасно вести велику кількість проектів, причому для різних мов і технологій, так що HTML5-проекти можуть існувати в довільній кількості і незалежно від інших проектів.

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

Створити новий проект можна одним з трьох способів:

  • Пункт New Project в головному меню
  • Кнопка New Project в головній інструментальної лінійці
  • Комбінація гарячих клавіш Ctrl + Shift + N

Мал. 4. Діалог створення нового проекту

Після вибору потрібних опцій і натискання кнопки Next, з'являється діалог параметрів HTML5-додатки, в якому потрібно вказати назву проекту і прив'язати цей проект до дискового каталогу, де він і буде розміщений.

Клік правою кнопкою миші на елементі і вибір пункту Go To Source в меню дозволяє швидко перейти до цього елементу в файлі вихідного коду.

Друге вікно - Browser DOM - дозволяє побачити поточну структуру сторінки з деякими характеристиками її елементів. У цьому вікні представлені DOM- елементи сторінки разом із застосованими до них стилями.

Мал. 20. Вікно Browser DOM, що представляє DOM-ієрархію елементів файлу і їх стилі


Робота зі стилями CSS

Нова версія NetBeans включає підтримку CSS-препроцесорів Sassy і LESS, включаючи колірну підсвічування синтаксису і семантики конструкцій мови, автоматичні відступи, переформатування, фолдінг коду і шаблони файлів. Для всіх варіантів синтаксичних конструкцій CSS забезпечуються автозавершення коду і інструменти рефакторинга.

Мал. 22. Робота зі стилями (CSS) в NetBeans

Крім того, змінювати стилі документа можна прямо в додаткових панелях браузера в режимі Inspect in NetBeans, як описувалося вище.

Ну і нарешті, підтримка стилів реалізована і для мобільних пристроїв. а саме для Chrome на платформі Android і для Mobile Safari на iOS з використанням платформи Apache Cordova. Версія Cordova також включена в дистрибутив NetBeans, але вимагає додаткової настройки для підтримки проектів Android і iOS.


Підтримка мобільних пристроїв і розробка для Cordova

У цій статті коротко перераховані тільки нові можливості NetBeans, що стосуються розробки HTML5-проектів. Але NetBeans розвиває і традиційні, що стали вже фактично стандартними можливості, роблячи їх більш зручними і ефективними в застосуванні.

Нарешті, підтримка сучасних інструментів управління версіями - а NetBeans підтримує як давно відомі інструменти Mercurial і Subversion, так і відносно недавно з'явився і дуже швидко став супер популярним Git - дозволяє легко організувати командну роботу, забезпечуючи високу надійність процесу розробки.

Отже, підіб'ємо підсумок.

Навіть короткий розгляд нових можливостей NetBeans IDE дозволяє зробити висновок, що вона не випадково є одним з лідерів на сучасному ринку інструментів розробки для Web. Цілеспрямоване її розвиток змушує очікувати виходу нових, ще більш потужних і зручних версій. Зараз вже починається попереднє тестування нової, восьмої версії IDE. Які нові можливості надасть вона? Це ми дізнаємося вже скоро.

Схожі статті