… часто спрашивают на форумах по веб-разработке.

Распространённое заблуждение

Когда вопрос «Какие книги посоветуете?» задают новички в веб-технологиях и начинающие программисты, в ответ часто можно услышать предложения прочитать фундаментальные книги. Эти книги переворачивают взгляд на код, позволяют упорядочить знания, правильно проектировать сложные программные системы и программировать профессионально. Их советуют из добрых побуждений: если они так классно помогли кому-то, то (логично ведь?) помогут и всем остальным. Это очень распространённый совет профессионалов: читайте профессиональные книги. И это очень распространённое заблуждение.

Спойлер: там, в конце, есть ссылка на примеры кода «Привет, мир!» на 500+ языках программирования и генераторы текста песенки «99 bottles of beer» на 600+ языках программирования и 34 варианта решения одной задачи «поиск 25ти самых частых слов» на Python разного уровня сложности. Ищи внимательно.

Прежде чем открыть «Чистый код»

Возможно, что тебе тоже посоветовали «Чистый код» и «Банду четырёх». И теперь ты в раздумьях: читать или не читать? Или ты уже прочитал пару глав и в тебе зародилось сомнение: а не зря ли ты взялся за эту тему? Это же просто китайская грамота какая-то, а не книга. Как можно читать такой труд и не понимать ни строчки? Может что-то не так в тебе … ? Стоп!

Четыре года назад я начал программы поддержки начинающих и стажировку по веб-технологиям. В большинстве случаев ко мне обращались те, кто вообще ничего не знает ни о программировании, ни о веб-технологиях. Слово «сервер» для них означает большой компьютер. «Клиент» — это покупатель в магазине или посетитель банка. «Hello, World» в программном коде никогда не видели.
Конечно же, мы совместно подбирали литературу. И прежде чем попытаться предложить профессиональные супер книги, я всегда мысленно вставал на сторону новичка: насколько ужасно будет попытаться прочитать страницу и АБСОЛЮТНО НИЧЕГО НЕ ПОНЯТЬ? Не вызовет ли это страх от непонимания или отвращение из-за сложности? Да, вызовет.

Простое объяснение:

• прежде чем писать, надо читать
• прежде чем читать «Чистый код», надо научиться писать грязный неуклюжий код
• прежде чем правильно проектировать большие программные системы, надо неправильно спроектировать свою маленькую программу

Нужно научиться читать программы

Вот таким образом нужно изучать все фрагменты кода, которые ты встретишь в книге или статье.

Научись читать код. Фрагмент из книг серии «Head First» без разрешения автора, извиняюсь.

Если нет понимания, нужно либо прочитать об этом, либо спросить кого-либо. И даже когда расписал всё и вроде как понял — нужно убедиться, что ты понял правильно. Для этого нужно выполнить фрагмент кода. Или, опять же, дать кому-нибудь твоё описание, чтобы проверить понимание написанного.

Научись мысленно выполнять код. Фрагмент из книг серии «Head First» без разрешения автора, извиняюсь.

В университете почти год тратится на то, чтобы научиться понимать фрагменты кода длиной от двух до двадцати строк. Две строки кода, Карл! В C++/Javascript/C# и многих других языках — одна точка с запятой в другом месте и смысл меняется. В Python — пропустил один пробел и алгоритм работает по-другому. Повторно инициализировал переменную и её значение внезапно исчезло. Не дописал один знак равенства в условии и его значение поменяется на противоположное.

В голове у меня живёт браузер и веб-сервер. Часть кода JS/CSS/HTML я вполне могу интерпретировать и отобразить мысленно, как браузер. Где-то рядом с ним — консоль PHP, Python, Bash, Power Shell — пока я скольжу глазами по коду, он уже выполняется строка за строкой.
Пример 1. На собеседовании мне дали лист кода на PHP. Пока ведущий собеседования искал вопрос, соответствующий этому листу, я уже карандашом исправил все ошибки и пометил значками (!) места, в которых мог быть SQL Injection. Он только вздохнул.
Пример 2. Есть немало людей, которые проходили Анкету по веб-технологиям за несколько минут и без ошибок.
Просто мы это уже видели, пробовали повторить и знаем, как оно работает. Когда-то я мог закопаться в том листе, а в анкете не поставить ни одного ответа.

Итак, надо научиться читать код.

Далее предстоит научиться писать грязный неуклюжий код

Что писать? Повторять примеры из книг, статей, видео-курсов.

Нужно выработать в себе 2 чувства: скептическое отношение к мнению автора и острое желание повторить. Не доверять автору, мысленно спорить, смотреть на его примеры с ехидной такой ухмылочкой: «Да ну? Врёшь ведь!». И проверять на практике все предлагаемые куски кода. Шаг в сторону поощряется. За прыжки дают медаль «За отвагу». Ты представь, что автор тебе пудрит мозг, а ты должен вывести его на чистую воду. Ну просто детектив, а не программирование!

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

Ещё больше ошибок в пиратских электронных версиях книг, отсканированных и распознанных с помощью программ OCR. Количество ошибок там невероятно большое.

И, наконец, надо писать свои программы. Ну и пусть такие же точно программы уже написали 100 000 других программистов. Ну и пусть в твоей программе неуклюжая логика. Ну и пусть по 1500 строк в одном файле или по одной строке в 1500 файлах. Ну и пусть там всё написано строго поперёк каких-то там «Правил хорошего кода», принципов S.O.L.I.D., D.R.Y и K.I.S.S, о которых твердят книги и вторят на habrahabr и в других интернетах. Пусть там будет большое количеством жёстко прописанной логики. Путь там не будет комментариев. Пусть всё это работает без файлов конфигурации. Пусть любая тупая мартышка может взломать твою систему.

У каждого был и будет свой «велосипед», «говнокод» и «костыли». Даже профи такое пишут, причём прямо сейчас, потому что им некогда писать правильно, потому что надо программу на один раз или потому что им просто лень.

Когда я познакомился с веб, JavaScript был прост и неуклюж. Никто не заморачивался областью видимости, замыканиями, объектами, классами. Тогда актуальным было обсуждать, стоит ли делать навигацию с помощью выпадающего списка (хотя актуально и сейчас):

<select onchange="if(this.value) window.location.href=this.value">
    <option value="">Select page to go...</option>
    <option value="http://copi.st/features">copi.st/features</option>
    <option value="http://copi.st/api">copi.st/api</option>
</select>

Не более сложной была анимация смены изображения:

<img id="someimg"><br/>
<a href="#" onclick="document.getElementById('someimg').src='http://copi.st/cMsc.150-030-fff.png'; return false;">Green</a>
<a href="#" onclick="document.getElementById('someimg').src='http://copi.st/cMsc.150-555-fff.png'; return false;">Black</a>

И именно эта примитивность очень легко запоминалась, потому что легко понять и запомнить функцию из 4-5 строк.

На чём ещё тренироваться?

В статье Посоветуйте задачи для начинающих на C++ / Php / Ruby / Python / Javascript указаны русскоязычные и иностранные ресурсы с задачами по программированию, с интерактивными обучающими проектами в формате игр.

Постепенно ты обрастёшь грязным кодом. Большим количеством спутанного беспорядочного кода.

Cпроектируй свою большую программу

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

Ты сам должен понять, что твоя система стала слишком большой, чтобы продолжать дописывать её в том костыльно-велосипедном стиле, который допустим для небольших учебных программ. Скажем, если тебе захотелось вывести страницу текста, храняющуюся в файле — это одно, а сделать блог или музыкальный каталог — это совсем другое. Там просто много кода, много логики, много кусков интерфейса пользователя. Продолжать мешать всё беспорядочно в один-два-сто файлов — непрактично. Настанет момент, когда ты захочешь добавить ещё чуть-чуть красоты и удобства, а найти нужный фрагмент кода для внесения изменений не сможешь. Или захочешь показать проект кому-нибудь, но не сможешь понятно рассказать, как он устроен.

Вот тут то и приходят умные профессиональные книги. Они меняют мировозрение, причём кардинально и навсегда. Они учат правильно проектировать приложения, удобно разделять логику, хранение данных и интерфейс пользователя, … Но опять стоп! Эти книги толстые и сложные. Их ещё рано читать.

Почему профессиональные книги сложные?

В большинстве случаев в сложных книгах нет готовых программ, вместо них какие-то нерабочие абстрактные куски кода или даже схематичные рисунки.

Вот пример из известной книги «Эффективная работа с унаследованным кодом» (автор Майкл К. Физерс) 3-е издание, стр. 44 (то есть одна из первых глав)

public class Sale
{
    private Display display;

    public Sale(Display display) {
        this.display = display;
    }

    public void scan(String barcode) {
        ...
        String itemLine = item.name()
            + " " + item.price().asDisplayText();
        display.showLine(itemLine);
        ...
    }
}

Это написано на языке Java, но это не важно. Этот код даже до этапа запуска не дойдёт. Потому что Display — это неизвестный класс, а метод showLine не определён. И вообще троеточние (…) в коде недопустимо. Для новичка этот код абсолютно нерабочий. И такие примеры в этой книге — все!

Второй пример — диаграмма из ещё одной профессиональной книги книги «Совершенный код» (автор Стив Макконнелл) 2-е издание, стр. 85.

Прямоугольники — это объекты. Каждый прямоугольник поделён на три части: сверху (Emloyee) — это название класса, ниже (name, title, billingRate) — свойства объекта, ещё ниже (GetHoursForMonth()) — методы объектов, стрелки между прямоугольниками — это отношения. Я сейчас описал только то, что видят все. Но не все догадаются, что на самом деле прячется в методе GetHoursForMonth() и как именно реализуется стрелка между прямоугольником Timecard и прямоугольником Emloyee. Некоторые даже не поняли, что такое «объекты», «свойства», «методы», «отношения». То есть эта схема — нерабочая. И таких диаграмм там сотни.

Я представляю, как начинающий программист смотрит на ЭТО и видит НИЧЕГО. Это настолько же понятно, как китайские иероглифы. Ну то есть вообще не понятно.

А теперь пример из книги «С++ за 21 день»

Фрагмент книги «C++ за 21 день»

Если набрать этот кусочек кода и подвергнуть обработке компилятором c++, то запустится программа и выполнит то, что в неё заложено. Этот кусок кода является завершённым полноценным примером.

Вот рабочий пример веб-сервера на Python, взятый из обзорной статьи по языку:

from wsgiref import simple_server

def app(environ, start_response):
  start_response('200 OK', [('Content-type', 'text/plain')])
  return ['Hello, world!']

# http://127.0.0.1:8000/
server = simple_server.WSGIServer(('', 8000), simple_server.WSGIRequestHandler)
server.set_app(app)
server.serve_forever()

Нужно только скачать себе дистрибутив Python и выполнить файл с указанным скриптом, чтобы в браузере по ссылке http://127.0.0.1:8000/ появилась фраза «Hello, world!»

Аналогичный пример на nodejs, взятый из статьи

var http = require('http');

http.createServer(function (request, response) {
    response.writeHead(200, {'Content-Type': 'text/plain'});
    response.end('Hello, World!\n');
}).listen(8080);

console.log('Server started');

Для его запуска тоже нужен дистрибутив NodeJS. Затем можно выполнить файл с указанным скриптом и открыть в браузере страницу http://127.0.0.1:8080/

Начинать с букваря

Новичку супер книги не нужны. Нужны мини-книжки, серии «%что-то% для чайников», «%язык% за 21 день». Учитель начальных классов подтвердит: процесс обучения начинается с алфавита и счётных палочек. И под каждого школьника свой алфавит не изобретают, не практично это — все учатся по одинаковым букварям, только издательство разное и год выпуска, а принцип одинаковый.

Математику начинают не с дифференциальных уравнений, а с арифметики на счётных палочках. Потом сложение/вычитание, умножение/деление, скорость, время, расстояние, дроби и так далее. К дифурам дело подойдёт постепенно.

Спроси у преподавателя английского языка, будут ли его курсанты на первом уроке писать статью на первую полосу New York Times на чистейшем английском? Он скажет: нет, мы будем учить алфавит, учить слова и формы глаголов, переводить тексты туда-сюда, писать сочинения, делать устные доклады, общаться в группе между собой, слушать голос с аудио-диска, смотреть видео-ролики, выполнять контрольные письменные и устные работы. До статей в газету дело дойдёт не скоро.

В отличие от них, я — профессиональный веб-архитектор, а не педагог, и то, чему учили их в педуниверситете, до меня дошло опытным путём при работе по программам менторской поддержки.

В целом, конечно, умные книги принесут пользу, но начинать надо не с них.

Самая простая, самая типичная задача для новичков, чтобы «потрогать» язык — вывести «Hello, World!». Вот примеры кода «Hello, World!» на 500+ языках программирования (зеркало на случай, если этот сервер упал: http://www.roesler-ac.de/wolfram/hello.htm).
Или вот ещё песенка 99 бутылок пива на 600+ языках программирования.
Или вот один (условно) язык программирования и 34 варианта одной и той же задачи «поиск самых популярных слов в тексте«.

Без метафор

Если откинуть все метафоры про буквари, то начитать надо с обзорных статей и видео-уроков, чтобы для себя понять — нравится или нет. Это касается как языков программирования, так и технологий в целом.

Есть так называемые тесты для профессиональной ориентации, они позволяют определить личные предпочтения и на основе этого сделать прогноз о будущей профессии. Потрать время, оцени заранее — будет ли интересно. Когда-то очень давно аналогичный тест показал мне, что специальности, связанные с логикой и знаковыми системами будет мне наиболее подходящими, а именно юриспруденция, экономика и информационные технологии. В итоге сейчас я веб-архитектор с опытом разработки в областях, связанных с экономикой и правом (биллинговая система для управляющих компаний, расчёты по IP-телефонии, электронным деньгам, учёту и прогнозу экономии энергоресурсов). Меня прогнозы не обманули. Вот несколько сайтов с анкетами: один, два, три.

Далее — простая книга «для чайников», чтобы узнать термины, синтаксис, основы и, опять же, понять — нравится или нет. Не стесняйтесь названий «для чайников» или «для нубов». Нуб — это заимствованное слово «newby» (англ. новичок). «Чайник» — в англ. «dummy» — это лишь сленговое словечко, установившийся разговорный термин, означающий «дилетант» или «не специалист».

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

Если ты думаешь, что я несу околесицу, ведь на каком-нибудь Codecademy с первых минут новички уже пишут программы, то я скажу, что тестовое окружение в таких системах — это идеальная среда исполнения, изолированная от реальности, оставляющая за рамками курса 90% внешних факторов, например, различие версий интерпретаторов и компиляторов. Там решение даже подсказывается и вместо того, чтобы посмотреть справочник по языку, можно просто нажать кнопку помощи и скопировать оттуда полностью рабочий код. А также отмечу, что в большинстве областей прикладного программирования (то есть те, где программирование реально решает какие-то практические проблемы) знание синтаксиса языка — это только базовый навык и ещё много всякого, весьма интересного лежит глубже, чем умение записывать мысли в форме команд. Аналогично, в некоторых областях математики умение решать дифференциальные уравнения является знанием уровня алфавита, то есть ничего. Аналогично, умение свободно говорить и писать на иностранном языке — это всёго лишь владение языком как инструментом, что никак не связанно с тем, что и как именно человек будет писать, пользуясь этим языком.

Ещё один популярный аргумент, которым начинающие пытаются само-мотивировать себя: можно научить плавать, если кинуть в воду в глубоком месте. То есть надо взяться за очень сложный проект и на нём изучить все ньюансы проектирования и разработки информационных систем или языки программирования. Ну плавать, предположим, можно научиться, потому что функция «держаться на воде» у некоторых людей есть в генетической памяти, а вот иностранные языки и алгоритммическое мышление почему-то там отсутствуют. Есть люди со склонностью к изучению инстранных языков — они быстрее других их изучают, но учить начинают всё равно с нуля. Точно так же есть люди со склонностью к логике и знаковым системам и языки программирования для них — всего лишь способ изложить мысли, но к этому надо прийти через путь «от простого к сложному».

Источники информации для заинтересовавшихся

Обзорные статьи

Воспользуйтесь поиском по интернет-ресурсам, связанным с информационными технологиями и социальными сервисами помощи: Habrahabr, Toster, HashCode и гугли по фразам «%lang% tutotial» «%lang% quick start» «%lang% быстрый старт» «%lang% hello world» 🙂

Есть специальные подборки ресурсов для того, чтобы максимально быстро изучить основы, выявить разницу между языками, диалектами языков, фреймворками. Примеры:

• Быстрый старт: Ruby за 20 минут и В Ruby из других языков
• The 9 Best Free Ruby on Rails Tutorials
• TODOlist на всех JavaScript фреймворках
• PHP The right way и PHP Best practice
• Javascript The right way

Языков и технологий много. Если запутались, спрашивайте меня

Книги для начинащих

• Серия книг «Head First» издательства «O’Reilly Media» — около 20 книг по популярным технологиям и языкам программирования с чрезвычайно удобным изложением материалов.
• Серия книг «%XXX% для чайников» — старая уже серия. Каждая книга включает и обзорные материалы, и практические примеры, а также может служить справочником.
• Много книг по интересующим языкам программирования и веб-технологиям можно найти на ozon.ru, labirint.ru, read.ru. Смотрите отзывы, листайте доступные фрагменты, спрашивайте меня.

Советы по изучению книг от издательства O’Reilly

Немного полезных ссылок:

• Как самостоятельно переучиться на веб-разработчика?
• Нет прогресса в изучении. ЧЯДНТ?
• 8 шагов организации процесса обучения веб-технологиям
• 7 советов «Как научиться программировать»
• Анкета по веб-технологиям

Умные книги по информационным технологиям и разработке программного обеспечения

Упомянутые книги, которые перевернули моё представление о программировании и программной архитектуре, перечислены в отдельной статье «Умные книги по программированию и проектированию информационных систем«.

Изображение «Life’s A Beach Book Sculpture» позаимствовано у wetcanvas.