[JavaScript] #0 Практикум. Введение. Изучаем JavaScript вместе на примерах и задачах. Выбор среды разработки Brackets, CodePen, jsFiddle

Я давно хотел выучить какой-то из современных языков программирования, ориентированного на web. Выбор был между php и JavaScript. JavaScript перевешивал в силу большей своей популярности.

Недавно на ГОЛОСЕ создали Академию, где можно самому научиться или других научить знаниям, а если и то и другое совместить - будет вообще отлично. Тем более что появились уроки JavaScript от @qqc и @rassen – будем изучать JavaScript в @academy.

Как можно научиться программировать? – По книжкам? – По урокам? ...
Научиться программировать можно только программируя! Во всяком случае этот путь намного эффективней, и естественно с уроками.

Как можно выучить язык? – нужно просто начать на нём разговаривать писать программы, программировать.

Начнём

Первое что я сделал – скачал упомянутый @qqc в её посте редактор Brackets. Всё так не знакомо и не привычно. Может начать со старого доброго блокнота notepad? Или поискать другой редактор, чтобы всё было понятно и привычно, как в старое доброе время. Несколько дней я Brackets запускал, вставлял описываемые в уроках примеры, запускал на выполнение код, смотрел результат, но всё-таки чувствовал себя не в своей тарелке. Но вот сегодня я сделал открытие, то ли уже привык))). Но обо всём по порядку.

Скачиваем Brackets и если у Вас нет браузера Chrome скачиваем и Chrome. Почему именно Chrome? Дело в том что разработчики Brackets установили связь с этим редактором, о чём Вас при первом запуске уведомят. Получается Brackets и Chrome работают в одной упряжке, помогая друг другу.

Скачали? Установили? – Запускайте. Теперь расположите их окна так как я – это именно то, что позволило мне чувствовать себя комфортно.

Редактор расположен слева, а окно браузера - справа. Редактируя свой текст в окне Brackets стоит его только сохранить (нажав Ctrl+S), как тут же виден результат в окне браузера Chrome. Окно браузера не нужно обновлять и не нужно переключаться на него, выискивая среди других свёрнутых окон. Это именно та интеграция Brackets и Chrome, что я упоминал. Интеграцию с другими браузерами разработчики обещают позже. Для меня это было очень существенно и именно это вдохновило меня именно сейчас начать изучать Практикум по JavaScript.
 
В процессе поиска чего то лучшего чем Brackets я нашёл несколько онлайн сред разработки – можете выбрать себе понравившуюся. Это замечательные сервисы. Их удобство в том, что:

• код сохраняется на сайте, даже если Вы там по какой-то причине не зарегистрировались,
• Вы этим кодом можете поделиться в виде ссылки, похвастаться, например, оригинальным решением, или же наоборот рассказать о Вашей проблеме и обратиться за помощью.
• не нужно ничего скачивать, устанавливать, сохранять, копипастить, загружать, пересылать. Красота.

Мне приглянулись два из них СodePen и jsFiddle, уже после того как приглянулся Brackets)))

Отправим классическое приветствие - "Привет ГОЛОС!"

var z="Привет, ГОЛОС!";
document.write("<H1><center>"+z+"</center></H1>");

посмотрите CodePen

нажмите на ссылку с примером и он автоматически откроется в среде, ничего копипастить не надо
http://codepen.io/nsergiy/pen/PWvbpq?editors=0010

В этой среде при минимуме навыков даже запускать ничего не надо, редактируете или пишете код в колонке JS и при отсутствии ошибок в окне вывода отображается результат, даже в процессе редактирования.

посмотрите jsFiddle

нажмите на ссылку - откроется jsFiddle с примером
https://jsfiddle.net/jsergiy/17h05fqn/2/

А в этой среде после редактирования текста для запуска нужно нажать Run. Эта среда мне больше понравилась, но пользоваться я буду всеми.


Думаю онлайн-среда многим больше понравиться, особенно начинающим. Ознакомьтесь с каждой средой, выберите себе ту что Вам приглянулась, перечитывайте Уроки JavaScript в Академии и до встречи на Практических занятиях


Голосуйте, подписывайтесь, если хотите изучать программирование и JavaScript.