Cloud9 IDE спеціалізується на веб-розробці. Cloud9 є безкоштовною для публічних (видимих всім) проектів, але для приватних проектів штука платна. Підсвічування синтаксису чудова, і є підтримка «прикраси» коду, авто доповнення. Які мови програмування та типи коду підтримує — див. скріншот.
На відміну від попередньо розглянутих он-лайн редакторів коду, Cloud9 містить вбудовану підтримку імпорту на GitHub, Mercurial, BitBucket, увійшовши в систему через один з цих сервісів. Працює через консоль в нижній частині екрану. Cloud9 надає SSH-ключ, який можна зареєструвати в GitHub, щоб не бачити кожного разу запиту при спробі закомітити код.
Зі смачненького ще… Редактор при введенні повідомляє Вас про помилки в коді. HTML-сторінки можуть бути протестовані й переглянуті прямо в інтерфейсі. А якщо потрібен деплоймент, то Cloud9 IDE підтримує розгортання в Joyent і Heroku.
Саме з Cloud9 розпочиналося моє знайомство із програмуванням. До пори до часу цей он-лайн інструмент IDE був мені… так нічого собі… дозволив мені гарно навчитися працювати із Git -ом (системою керування версіями). Але ж Божечко!!!! Який безкоштовний Cloud9 повільно тянучкий… Із нього зістрибнула => на ATOM Editor. Підкреслю, хоча Python Fiddle, JS Fiddle користуюсь далі часто.
Отож, детальніше за посиланням: Огляд редактора коду ATOM
ATOM Editor -у достойну конкуренцію складає інтегроване середовище розробки під назвою Eclipse Che від відкритого співтовариства розробників. Узагалі, Eclipse ДУЖЕ популярне середовище розробки у джавістів, тому якщо Ви зацікавилися мовою програмування Java, зокрема плануєте у майбутньому відвідувати курси Автоматизованого Тестування на JAVA — придивіться тоді до цього сервісу уважніше.
Eclipse Che доволі гнучкий у налаштуваннях «під себе». Розробники, а у нашому випадку — це тестери, можуть як створювати свої власні плагіни, так і кастомізувати наявні. Завдяки ним якраз і підтримуються усі можливі мови програмування. У Che також є попередній перегляд, тому зможете бачити результати свого коду таким, яким його будуть бачити користувачі — у разі вибору на користь цієї IDE. Працювати у середовищі Eclipse Che передбачено самостійно, так і разом зі своєю командою. Причому така опція, як і сама Eclipse Che абсолютно безкоштовна. Працює IDE на Windows, Mac OS X і Linux. Інсталюється простіше простого, шляхом аунтефікації через Google аккаунт чи Git Hub.
CodePen (Кодпен) — далі у нашому списку візуальних онлайн редакторів HTML, CSS, JavaScript коду. Зупинимося на ньому детальніше. В принципі, можливості CodePen частково схожі на різні повноцінні редактори коду, які багато хто використовує у своїй роботі: починаючи від Notepad ++, Sublime Text, і закінчуючи чимось складнішим типу Webstorm. Звичайно, я говорю не про Full версії всіх фішок, а лише про базові функції написання коду.
Разом з тим CodePen володіє рядом ключових переваг:
Надзвичайна простота роботи і онлайн перегляд коду. За дефолтних налаштувань, зміни відображаються в режимі реального часу.
Загальна доступність — вільна публікація розробленого коду або його фрагментів в режимі онлайн Share поміж іншими користувачами.
Для публікації розробленого прикладу знайдете у правому нижньому кутку сторінки 3 кнопки:
- Share — шерінг в соціальних мережах (FB, twitter, Google+);
- Export — збереження в Zip архіві або запис на GitHub;
- Embed — вбудовування на сторінку сайту.
Також цікава опція вбудовувати проекти, створені в сервісі, на будь-який сайт в якості прикладу. Просто надішліть посилання на ту чи іншу сторінку для перегляду.
Уся необхідна інформація зберігається в мережі. Тому завжди присутній доступ до сніппетів з будь-якого місця, навіть якщо особистий комп’ютер недоступний з яких-небудь причин.
Потужне співтовариство — це ще один привід користуватися CodePen. CodePen зареєстрована досить велика кількість досвідчених фахівців. За потреби можете отримати поради від більш просунутих або підказки по помилках.
Ресурс також має соціальні функції: підписки, лайки, коментарі. Наявна навіть опція створення блогу для тематичних заміток. Бажаєте слави? Позначте свої проекти тегами аби людям було простіше шукати Ваші сніппети.
Наявність прикладів різних завдань і рішень дозволяє бути обізнаним в основних актуальних напрямках веб-розробки. Гарні реалізації можна зберігати і використовувати згодом для тестових завдань, коли вимагатимуть їх зробити при конкурсному наймі на роботу (стосується програмістів). Або ж просто переглядайте роботи інших програмістів для натхнення або самонавчання.
Меню сортуваня на головній сторінці CodePen:
- Pens — приклади коду з сортуванням за новими / популярним тощо;
- Перегляд повноцінних проектів (а не простих фрагментів);
- Post — нотатки з блогів і корисні публікації;
- Collections — добірки декількох;
- Тематичні Pens з певних тем;
- Вакансії, блог розробників і список корисних посилань;
Експорт після збереження. Сутності Pens можуть бути експортовані у вигляді ZIP-файлу з усіма його придатками в HTML, CSS і JS в файлах. Плюс присутня можливість експорту в Github (репозиторій Git). Всі кнопки в правому нижньому кутку.
Повторюваний код можна теж зберегти у вигляді Pen і використовувати, як шаблон.
Слід зауважити, що в CodePen є й платні функції, які можуть значно розширити можливості: робота в команді, режим презентації, синхронізація, приватність і деякі інші. Якщо чесно, не знаю чи є якісь обмеження в сервісі на кількість створюваних проектів…
Підсумок:
Тепер уявіть, як би виглядав процес тестування фрагментів коду без використання цих сервісів?
Для розробки простої веб-сторінки — це створення кількох типів файлів (html,css, js), підключення сторонніх бібліотек, встановлення і налаштування параметрів текстового редактору чи IDE. У випадку з Back end -ом Python або будь-якою іншою мовою програмування, все виглядає ще складніше, адже спочатку необхідно встановити і налаштувати інтерпретатор скриптів на власному комп’ютері, створити проект. Що стосується різноманітних SQL-запитів, не обійтися без встановлення сервера бази даних та IDE для неї, створення власної бази і наповнення її таблиць.
Правда? Звучить не дуже зручно, особливо, коли потрібно всього протестувати невеличкий фрагмент коду або трохи потренуватися в його написанні.
Отже, як бачите, наведені вище інструменти дозволяють значно спростити процес навчання і розробки. Вони дозволяють тримати локальний комп’ютер вільним від зайвих файлів з лістингами коду та програмного забезпечення, ба тестувати власний код навіть з мобільних пристроїв, маючи лише встановлений браузер.