—»     —»   Краткий вводный курс в программирование для дизайнеров
  Раздел: Образование и Изучение   Комментариев: 1  

Краткий вводный курс в программирование для дизайнеров



Зачастую дизайнеры предпочитают не выходить за рамки привычного им мира HTML и CSS, не ступать на «земли» скриптинга и программирования. И на то есть веские причины. Программирование требует тщательного изучения и тренировки навыков, которые значительно разнятся с процессом разработки дизайна. Более того, здесь столько всего нужно выучить и знать, что многие дизайнеры просто не могут понять, откуда стоит начать: javascript, PHP, Ruby, Rails – как всё это можно изучить? http://www.cyberforum.ru/ruby/

Краткий вводный курс в программирование для дизайнеров

Тем не менее, на практике программирование не такое уж и страшное, как кажется на первый взгляд. Сегодня мы хотим вам показать, как можно однажды изучить, а затем постоянно использовать навык в программировании, причем в любом новом языке, который вы хотите изучить. Давайте рассмотрим 3 разных концепции программирования на разных языках, чтобы понять, насколько они похожи друг на друга. Если вы хотите начать изучать программирование, но абсолютно не понимаете, с чего начать, то это руководство как раз подойдет вам.

Страшно или нет, но вам наверняка понравится

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

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

Программисты же направлены на решение поставленной задачи. Они любят различные логические головоломки, им нравится ковырять код часами, и при этом не использовать воображение. Имейте в виду, что эти две категории людей абсолютно взаимоисключающие. Если вам нравится подобное описание, то вы точно любите или скоро полюбите программирование.

Не HTML или CSS

Мы подходим к сути о том, что многие веб-дизайнеры знают хотя бы немного о программировании за счет языков HTML и CSS. Эти знания, безусловно, помогут вам, но не настолько, насколько это может казаться.

HTML – это язык верстки, а CSS – язык, предназначенный для написания кода каскадных таблиц стилей, они в основном используются для оформления и внедрения статичного контента в заранее подготовленные страницы. Работа с данными языками значительно разнится с рабочим процессом языков скриптинга или объектно-ориентированного программирования.

Большой секрет программирования

Последний абзац, наверное, отбил у вас всякое желание, но не стоит принимать все так близко к сердцу, так как впереди нас ждут приятные новости! Если вы сходите в книжный магазин и случайно попадете в отдел программирования, то вы точно будете сбиты с толку. Столько разных вещей, которые нужно выучить! Такое же смятение у вас вызовет и внезапная встреча книжного червя, который знает, пожалуй, все языки программирования наизусть! Возникает очевидный вопрос - как у людей находится время на изучение всего этого? Многие новички настолько озадачены всей этой ситуацией, что сдаются, даже не попробовав.

Большой секрет для вас (если вы никогда не изучали программирование) заключается в том, что почти все языки программирования очень похожи. Многие из них даже используют одинаковый принцип разработки и одни и те же инструменты, которые позволяют вам достигать нужной цели.

Я открыл для себя этот секрет при первом взаимодействии с программированием: это был урок Java в колледже (не нужно путать с javascript). Хотя я на то время был молодым пареньком, аудитория была заполнена взрослыми мужчинами от 30 до 40 лет. Многие из них даже были на должности программистов в различных компаниях, некоторые из них имели до 20 лет стажа. Они, очевидно, были наняты для работы с другими языками, а теперь просто решили расширить сферу своих умений. Кстати, в большинстве случаев, за это платит их работодатель.

Придя на эти занятия, никто из нас не знал вообще, что такое Java. Тем не менее, уже к третьему занятию эти парни значительно обходили меня. Я лишь пытался набросать мелкие отрывки кода, основанные на фундаментальных знаниях, которые мы успели получить за время этих уроков. Мои же коллеги по группе, пользуясь теми же фундаментальными знаниями, разрабатывали колоссальные приложения с множеством различных функций.

Глупый ли я? Я пришел к выводу, что на этот вопрос так просто не ответить, так как мы изучали действительно сложнейшие вещи. Я изучал построение программ через призму Java, эти же ребята уже были знакомы с программированием, и им требовалась лишь небольшая помощь в том, как можно интерпретировать их знания так, чтобы они могли использовать их на холсте Java. Это сродни изучению первого языка в группе с полиглотами, которые изучают уже 6-й.

Я рассказываю всё это для того, чтобы наглядно продемонстрировать то, как, выучив один язык скриптинга или программирования, можно вскоре познать и остальные. Если вы умеете писать код PHP, то вы без труда научитесь писать его и на Ruby.

Основополагающие

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

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

Переменные

Краткий вводный курс в программирование для дизайнеров

Переменные – это отличная вещь! Если вы когда-нибудь прибегали к использованию LESS или чего-то схожего, то вы наверняка знакомы с причудами переменных и тем, как они позволяют сохранить значительные объемы времени. Я не совсем уверен, что они присутствуют в CSS, но программист во мне очень хотел бы, чтобы они там были.

Переменные представляют собой некий способ хранения информации. Вы можете хранить что-то крайне простым методом, когда вы можете просто указать, к примеру, число «39», и вам представится целый массив информации, содержащий множество нужных и полезных значений. Можно сказать, что переменные – это нечто вроде ящика. Сами ящики не кажутся важными, но важно то, что в них уложено. Тем не менее, ящики ведь и позволяют хранить эти важные вещи удобным образом.

Переменные в javascript

Давайте рассмотрим пример. Так как javascript – это скорее всего первый кандидат на изучение после HTML и CSS, мы начнем с примера именно в данном языке. Вот так переменные работают в JS:

// Creating a javascript Variable
var contentWidth;
contentWidth = 496;

// Using the Variable
alert(contentWidth);

Здесь вы можете видеть, как переменные работают в javascript. Сперва, вы «объявляете» переменную. При создании переменной, вы наверняка будете называть ее в соответствии с её функцией и содержимым. Далее, вы задаете этой переменной значение (зачастую эти два этапа объединены). В данном случае я задал ей произвольное число. Помните, что «contentWidth» - это и есть наш ящик, который содержит в себе что-то значимое (значение). Каждый раз, когда мы хотим осуществить доступ к данному ящику, мы просто используем имя переменной. В завершение примера я создал предупреждение и внес туда переменную. Это выдаст нам окошко со значением «496».

С одной стороны, это может показаться бесполезным, но попробуйте представить, если бы у нас было 300 строк кода, в каждой из которых мы обращаемся к данной переменной? Каждый раз, когда значение данной переменной изменяется, наш код продолжает функционировать, так как значение поменялось во всех строках сразу. Без переменных нам бы понадобилось значительно больше кода.

Переменные в PHP

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

Вот так выглядит принцип работы переменных в PHP:

// Creating a PHP Variable
$contentWidth = 496;

// Using the Variable
echo $contentWidth;

Видите сходство? Можно сразу выделить использование точки с запятой на конце каждого заявления, а также то, что комментирование производится идентичным образом. В этот раз мы объявили нашу переменную и задали ей значение всего лишь одной строкой кода. Можно заметить, что здесь все практически идентично, за исключением того, что в PHP в начале имени переменной используется знак $. И запомните, что команда echo лишь выводит информацию на страницу браузера.

Переменные в Ruby

Теперь давайте рассмотрим переменные в Ruby:

# Creating a Ruby Variable
contentWidth = 496

# Using the Variable
puts contentWidth;

Теперь вы можете видеть, что изучение новых языков программирования во многом заключается лишь в изучении их индивидуальных «причуд». Например, javascript и PHP используют точку с запятой на конце линии, а вот Ruby нет. Также здесь стоит выделить, что комментирование производится с помощью знака #, вместо //, а для вывода информации используется команда put.

Циклы

Краткий вводный курс в программирование для дизайнеров

Еще одна популярная в программировании конструкция – циклы. С помощью циклов вы можете уберечь себя от дублирования кода. Это можно реализовать за счет автоматизации процесса. Создавая цикл, вы должны указать его параметры (например, условия, при которых цикл будет прекращаться). Нам ведь не нужно, чтоб цикл повторялся вечно, для этого и нужны подобные параметры.

Циклы в javascript

В любом языке программирования существует несколько типов циклов. Один из циклов в javascript – while. В нашем примере мы задали значение, а затем создали отрезок кода, который должен быть выполнен множество раз до тех пор, пока переменная будет ниже 50. Далее, в этом отрезке кода мы определяем действия, которые должны быть повторены. В данном случае мы авторизуем значение переменной в консоли, а затем увеличиваем значение переменной постепенно на 1. Так как переменная увеличивается каждый раз, как запускается код, со временем она достигает 50, и в этот момент цикл прекращается.

// javascript "while" Loop

var x = 25;

while (x < 50) {
console.log(x)
x++; // Increases the variable by one
}

Того же можно добиться посредством цикла «for». Данная версия немного более краткая, так как здесь можно указать значение старта переменной, а затем условия окончания, а также действие. Всё это указывается одной строкой.

// javascript "for" Loop

var x = 25;

for (x=25;x<50;x++) {
console.log(x)
}

Циклы в PHP

Опять же, здесь мы видим, что PHP очень схож с javascript. После ознакомления с примером, приведенным выше, вы без труда сможете уяснить всё, что касается данной структуры в PHP. Здесь у нас также есть циклы while и loop, каждый из которых содержит практически идентичный с javascript синтаксис.

// PHP "while" Loop

$x = 25;

while ($x < 50)
{
echo $x;
$x++; // Increases the variable by one
}


// PHP "for" Loop

$x = 25;

for ($x=25;$x<50;$x++)
{
echo $x;
}

Циклы в Ruby

В Ruby также присутствуют while и for. Как видно, синтаксис в Ruby более краткий, нежели в предыдущих двух языках – здесь нет ни точки с запятой, ни фигурных скобок. Также, давай рассмотрим, как выглядит цикл for:

// Ruby "while" Loop

x = 25

while x < 50
puts x
x+=1 # Increases the variable by one
end


// Ruby "for" Loop

for x in 25..50
puts x
end

Функции

Краткий вводный курс в программирование для дизайнеров

Функции в программировании также помогают вам значительно сэкономить время, не повторяя один и тот же код. Когда вы разрабатываете код приложения, оно, вероятно, должно будет выполнять тысячи задач. Каждая задача представляет собой набор команд. Когда мы укомплектовываем команды в функцию, мы без труда можем вызвать ее вместо того, чтобы писать весь код заново. Таким образом, функции, как и переменные, позволяют выполнять задачу или набор задач.

Функции в javascript

Давайте создадим очень простую функцию в javascript, которая будет принимать введенное число и возводить его в квадрат. Здесь мы начинаем со слова function, а затем подкрепляем его переменной в скобках. Затем, внутри функции мы выполняем различные действия и возвращаем значение.

// Creating the Function
function squared(someNumber) {
return someNumber * someNumber;
}

// Using the Function
console.log(squared(9));

Когда мы используем функцию, мы заменяем переменную, заключенную в скобки, на любое число, которое нам нравится, а код внутри функции обработает это значение. В нашем примере, приведенном выше, результат будет = 81.

Функции в PHP

Сейчас вы уже настолько знакомы со схожестью PHP и javascript, что сможете проделать пример самостоятельно.

// Creating the Function
function squared($someNumber)
{
return $someNumber * $someNumber;
}

// Using the Function
echo squared(9);

Методы в Ruby

Опять же, Ruby немного отличается. На самом деле, в Ruby данная конструкция названа методами, а не функциями. Тем не менее, мы снова можем достаточно быстро применить имеющиеся знания.

// Creating the Function
def squared(someNumber)
return someNumber * someNumber
end

// Using the Function
puts squared(9)

Как видно, метод в Ruby производит ту же задачу, что и функция в javascript. Он позволяет нам вводить числа в параметры, а затем возводит их в квадрат и возвращает полученный результат.

Достаточно просто, не правда ли?

Сейчас вы должны понимать важность понимания программирования на практике независимо от знания какого-либо языка программирования. У всех языков имеется общая основа, которая позволит вам переходить от языка к языку. Многие из различий всего лишь относятся к семантике и немногие – к синтаксису.

Не нужно думать, что все языки программирования и скриптинга – одинаковы, потому что это не так. У всех есть особое предназначение, которое определяет то, как и когда их нужно использовать. Это примерно как выучить Adobe Illustrator, а затем перепрыгнуть на InDesign. Вы имеете дело с двумя разными вещами, которые предназначены для выполнения разных целей, хотя они и очень похожи между собой.

Вывод

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

Так откуда же начать? Как я уже говорил выше, веб-дизайнерам лучше всего начать с javascript. Данное приложение очень важно, особенно если научиться комбинировать его с jQuery, HTML и CSS, с которыми вы уже наверняка знакомы. Далее можно приступить и к PHP, знания которого помогут вам быстро освоить Ruby. Главное всегда помнить о том, что ваши возможности безграничны!
Обнаружили ошибку или мёртвую ссылку?
Выделите проблемный фрагмент мышкой и нажмите CTRL+ENTER.
В появившемся окне опишите проблему и отправьте уведомление Администрации ресурса.
Нужна органическая вечная ссылка из данной статьи? Постовой?
Подробности здесь
Вам понравился материал? Поблагодарить легко!
Будем весьма признательны, если поделитесь этой статьей в социальных сетях:

Ключевые тэги: PHP, javascript, Ruby
Опубликовал Design FactoRy   Прочитано (раз): 11400   |   Оставлено комментариев: 1
Автор перевода — CoolWebmasters.Com ©   |   Источник материала / оригинал статьи   Распечатать
Другие статьи и новости по теме:
Комментарий #1: 4 декабря 2011 @ 10:00
Написал: pleak — группа: Гости  
На сайте с: --   |   Публикаций: 0   |   Комментариев: 0
ICQ: --- не указано ---
Просто охрененная статья, именно то, что искал. Спасибо! fellow
Добавление комментария
Уважаемые пользователи!
При добавлении комментариев на сайт Вам следует учитывать следующее - все комментарии проверяются Администрацией на предмет отсутствия спама. При обнаружении признаков спама, в оставленном Вами комментарии, сам комментарий будет незамедлительно удалён, а Ваш IP-адрес будет забанен без предупреждения! Учётные записи пользователей, рассылающих спам, блокируются/удаляются без права последующего восстановления.

С уважением, Администрация сайта.
* = поля обязательны к заполнению
Полужирный Наклонный текст Подчеркнутый текст Зачеркнутый текст | Выравнивание по левому краю По центру Выравнивание по правому краю | Вставка смайликов Выбор цвета | Скрытый текст Вставка цитаты Преобразовать выбранный текст из транслитерации в кириллицу Вставка спойлера
Вопрос : Назовите месяц February по-русски
Подтверждение кода безопасности :

Включите эту картинку для отображения кода безопасности
обновить, если не виден код


Дизайн афиши
Портал о дизайне. Статьи и материалы о дизайне и искусстве
copygroupp.ru
Популярные публикации


















Свежие шаблоны сайтов каждый день
С миру по нитке
«    Июль 2017    »
ПнВтСрЧтПтСбВс
 12
3456789
10111213141516
17181920212223
24252627282930
31