Серверное веб программирование. Выбор метода решения задачи. Я хочу быть разработчиком полного цикла

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

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

Спокойствие, сейчас коллективный разум сделает выбор за вас.

В первой части поговорим о языках веб-пространства. Какой предъязыковой расклад надо знать и каков порядок изучения? Об этом далее.

Передовая, тыл и неочевидный выбор

Первый выбор, который надо сделать - сфера ответственности.

Front-end разработчики
Иногда их еще называют веб-дизайнерами, но это неправильно. Задача front-end разработчика сводится к созданию интерфейса, он отвечает за то, чтобы веб-страница загружалась быстро, не тормозила и код на ней работал правильно.

Backend-разработчики
Люди, ответственные за скрытую от глаз функциональность и обработку данных. Их работа - написание серверного кода.

Full-stack специалисты
Они востребованы наибольшим образом просто потому, что способны в одиночку выполнить все пожелания заказчика.

Конечно, проще всего поставить себе задачу разобраться со всем, но это лишь рассеет ваше внимание на ранних этапах, а на более поздних вы и так познаете необходимость хотя бы поверхностного изучения всех процессов. Поэтому пойдём по порядку и начнём с front-end.

Лицо, которое надо продать

Самое главное, что не надо делать человеку, желающему стать front-end разработчиком, так это искать минимальный список предъявляемый список требований к специалисту. В этом случае велик риск наткнуться на статьи, подобные статье «Frontend-разработчики должны быть в теме всего ». Всё что там написано - абсолютная правда, но прийти к этому надо начиная с малого, а малое - это 3 основных кита frontend-а: HTML, CSS и JavaScript. Базу для дальнейшнего обучения вы можете получить на .

Ещё несколько лет назад, изучив HTML и CSS в формате нескольких умных книг, а JS на уровне jQuery, можно было всерьёз претендовать на позицию junior-a. Однако сегодня времена изменились, а требования сильно возросли. Впрочем, знания HTML и CSS по-прежнему можно уложить в пару хороших книг:

  • «Изучаем HTML5 » Брюс Лоусон, Реми Шарп,
  • «CSS. Рецепты программирования » Кристофер Шмитт.

На JavaScript придётся потратить достаточно много времени. Здесь мало будет изучить теорию, например по книге «JavaScript: Сильные стороны ». Необходимо несколько месяцев набивать руки и тренировать мозги на практике, в том числе используя упомянутый jQuery.

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

Обработать, прикрутить и создать

Базовый язык для любого back-end разработчика - PHP. Это некоторая основа, знать которую в совершенстве, как и делать основным инструментом, совсем не обязательно, но на базовом уровне понимать обязаны. Для этого можно хотя бы внимательно изучить книгу «PHP: правильный путь ».

Что касается актуальных языков, то выбирать скорее всего придётся из Ruby и Python, причём выбор этот - чистая вкусовщина. Даже здесь на периодически вспыхивают споры, но даже в споре за удобство изучения однозначного победителя найти невозможно. По Python полезно будет прочитать книгу с незамысловатым названием «Изучаем Python », по Ruby - «Rails 4. Гибкая разработка веб-приложений ».

Ещё один язык из разряда must know - всё тот же JavaScript с его производными jQuery и Ajax. В данном случае интересует именно back-end разработка, поэтому тратить время на общее изучение языка не имеет смысла, а вот посещение ресурсов вроде блога Антона Шевчука может оказаться крайне полезным.

Ну и конечно потребуются знания в области баз данных. Как минимум, это означает изучение SQL, как максимум - опыт работы с популярными БД.

Один за всех

Правда профессии веб-разработчика в том, что так называемых «сферических» специалистов здесь практически нет, да и рядовые заказчики далеко не всегда понимают эти деления, поэтому в том или ином виде к full-stack-у придётся прийти довольно быстро. Соответственно перечитайте предыдущие 2 раздела, посетите ещё раз и начинайте грызть гранит программной науки.

Знания не о языках

Помимо самих языков, необходимо изучать все прилагающиеся к ним профильные надстройки. Особенно это касается JavaScript (AngularJS, Knockout, Backbone) и CSS (Bootstrap, Foundation). Кроме того вам необходимо набить руку с системами контроля версий Git и SVN.

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

Что? Какое еще серверное программирование? Что это за беда? И зачем она нам нужна?

Мы, вроде бы, научились создавать Web-страницы в среде Dreamweaver. Мы даже научились создавать с его помощью целые Web-сайты и публиковать их на Web-сервере. Мы изучили две разновидности дизайна страниц: фреймовый, когда сайты строятся на основе наборов фреймов, и табличный, когда содержимое страницы помещается в большую сложную таблицу. Мы познакомились с таблицами стилей, метатегами и серверными директивами. И, наконец, узнали о Web-программировании и Web-сценариях, позволяющих добавить "жизни" нашим статичным страничкам. Что же еще надо для счастья?

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

Так давайте же сделаем следующий шаг - перейдем от страниц, хранящихся в файлах на сервере, к страницам, генерируемым специальными программами. Как раз написанием таких программ и занимается серверное программирование.

Но давайте по порядку. И начнем мы с того, что выясним, зачем нужны эти серверные программы.

Что такое серверное программирование

Действительно, что это такое и с чем его едят?

Зачем нужны серверные программы

Вы когда-нибудь посещали интернет-магазин? Например, популярнейший "Озон" (http://www.ozon.ru) . Помните, как там выполняется заказ товара?

Если не помните или вообще не знаете, что такое интернет-магазин, давайте вспомним (или узнаем).

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

Что происходит при этом? Как обрабатываются введенные вами данные? Неужели самим Web-обозревателем?

Отнюдь. Эти данные обрабатываются на Web-сервере.

Интернет-магазин - просто один из примеров, пришедших в голову автору, являющемуся поклонником и постоянным клиентом вышеупомянутого "Озона". Точно так же работают серверы электронной почты, основанной на Web, поисковые машины, электронные доски объявлений, форумы, вообще, любые Web-сайты, принимающие от посетителя какие-то данные и обрабатывающие их. Во всех этих случаях Web-обозреватель принимает от посетителя данные и отправляет их Web-серверу, который обрабатывает их и выдает результат обработки в виде автоматически сформированной Web-страницы.

Как это происходит на деле? Сейчас мы это выясним. И первым делом ответим на вопрос...

Как Web-сервер обрабатывает данные пользователя

Итак, каким же образом программа Web-сервера обрабатывает данные, отправленные ей пользователем?

Да никак. Web-сервер не приспособлен их обрабатывать. Его задача: прием от Web-обозревателя запроса на файлы (Web-страницы, таблицы стилей, графические изображения, фильмы, звуки, архивы, исполняемые файлы и т. п.), поиск этих самых файлов на жестких дисках серверного компьютера и отправка найденных файлов назад Web-обозревателю. Это его основная задача. Конечно, некоторые особо мощные серверы могут выполнять дополнительные действия над отправляемыми файлами перед собственно их отправкой (в частности, выполнять серверные директивы). Есть и программы-"многостаночники", выполняющие функции не только Web-сервера, но и сервера FTP, почты, новостей UseNet и бог знает чего еще. Но основная функция: простая выдача файлов по требованиям клиентов -и не более того.

Секрет в том, что данные посетителя обрабатываются не самим Web-сервером. Для этого применяются специальные программы, работающие вместе с Web-сервером на том же серверном компьютере. Они называются серверными программами, не имеют интерфейса пользователя и "общаются" только с Web-сервером, принимают от него введенные пользователем данные и возвращают ему результат. Этим они коренным образом отличаются от клиентских программ, работающих непосредственно с пользователем. (К клиентским программам относится, в частности, ваш любимый Web-обозреватель.)

Из этого следует, что Web-сервер умеет-таки принять данные от пользователя. Да, это входит в его основную задачу: принять данные и перенаправить их серверной программе. В свою очередь серверная программа их обработает и вернет Web-серверу результат.

Вот тут-то и начинается самое интересное. Дело в том, что результат, возвращаемый серверной программой Web-серверу, - это не что иное, как обычный HTML-код! Фактически серверная программа возвращает готовую Web-страницу, сформированную на основе данных, введенных посетителем. Такая страница называется динамической, в отличие от статических страниц, написанных Web-дизайнером и сохраненных в файлах на дисках серверного компьютера. А уж эту динамическую страницу Web-сервер и направляет клиенту в качестве ответа на введенные данные.

Серверные программы делятся на следующие четыре вида.

  1. Исполняемые программы, работающие через интерфейс CGI (Common Gateway Interface - общий интерфейс обмена), так называемые CGI-npoграммы. Эта разновидность серверных программ - самая старая, однако отнюдь не устаревшая.
  2. Расширения Web-сервера (приложения формата ISAPI, NSAPI, модули расширения Apache и т. п.). Новый способ, позволяющий встраивать серверные программы в сам Web-сервер, делая их его составными частями. Впервые предложен фирмой Microsoft для их сервера Microsoft Internet Information Server (интерфейс ISAPI) и разработчиками популярного бесплатного Web-сервера Apache.
  3. Активные серверные страницы (ASP, JSP и др.). Фактически это обычные статические Web-страницы, сохраненные в файлах, Которые, кроме обычного HTML-кода, включают в себя команды, обрабатываемые либо самим Web-сервером, либо его расширением. Также новый способ, впервые предложенный Microsoft для того же Internet Information Server.
  4. Серверные сценарии, написанные на интерпретируемом языке (Perl, Python, VBScript, JavaScript и др.). Обычные сценарии, работающие через интерфейс CGI или ISAPI на стороне сервера.

Теперь рассмотрим все это разнообразие подробнее.

CGI-программы представляют собой обычные исполняемые файлы, написанные на любом языке программирования и откомпилированные в ма шинный код процессора. Они не имеют интерфейса пользователя (как и все серверные программы), а работают с Web-сервером, получают от него входные данные и ему же пересылают результаты своей работы. Запускаются они самим Web-сервером, когда в них возникает нужда (когда необходимо обработать полученные от пользователя данные), и работают под управлением операционной системы серверного компьютера. При этом, если Web-серверу поступает одновременно несколько запросов на обработку данных от пользователей, он запускает соответствующее количество копий CGI-программы.

К достоинствам CGI-программ можно отнести легкость создания (многие среды разработки программ поддерживают создание таких приложений, в частности популярнейший Borland Delphi, начиная с версии 3) и простоту отладки. Также, поскольку CGI-приложения представляют собой независимые программы, они выполняются отдельно от Web-сервера (как говорят программисты и системные администраторы, выполняются в другом адресном пространстве). Это значит, что при сбое в CGI-программе завершается только она - сам Web-сервер остается "на плаву". А недостаток у CGI-программ всего один: большой расход системных ресурсов, поскольку для обработки каждого набора данных запускается отдельная копия серверной программы. И если Web-серверу поступит слишком много запросов на обработку данных, серверный компьютер может и зависнуть.

Расширения Web-сервера - более новая разновидность серверных программ. Они представляют собой обычные библиотеки DLL, в которых реализована вся логика серверной программы. Такие библиотеки как бы встраиваются в программу Web-сервера и работают как ее неотъемлемая часть. Поскольку библиотеки DLL работают только в среде Windows, для того чтобы создавать расширения в иных операционных системах, были придуманы и другие форматы. В частности, модули расширения сервера Apache не являются библиотеками DLL,

Именно в виде библиотек DLL создаются расширения Web-серверов Internet Information Server фирмы Microsoft и Netscape Web Server фирмы Netscape. В первом случае расширения имеют формат ISAPI (Internet Server Application Programming Interface - интерфейс программирования приложений интернет-сервера), а во втором - NSAPI (Netscape Server Application Programming Interface - интерфейс программирования приложений сервер^ Netscape). Формат модулей расширения Apache так и называется - модули Apache.

Достоинство у расширений Web-сервера одно: бережный расход системных ресурсов. Дело в том, что для обработки всех наборов данных пользователя запускается всего один экземпляр расширения, который отнимает существенно меньше ресурсов, чем уйма запущенных CGI-программ. Однако расширения труднее создавать и отлаживать, к тому же они не так безопасны.

Как CGI-программы. Поскольку они работают как часть Web-сервера, любая ошибка в расширении приведет к зависанию сервера.

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

Как уже говорилось, активные серверные страницы - это обычные Web-страницы, включающие в себя особые серверные сценарии, выполняемые самим Web-сервером или специальной серверной программой (CGI-приложением или расширением Web-сервера). В частности, ASP (Active Server Pages - активные серверные страницы), поддерживаемые Microsoft Internet Information Server, и JSP (Java Server Pages - серверные страницы, написанные на JavaScript), поддерживаемые рядом других Web-серверов, работают именно таким образом. Серверные страницы ASP пишутся на языках JavaScript и VBScript, a JSP - только на JavaScript.

Достоинства активных серверных страниц вы уже знаете: легкость и быстрота написания и простота отладки. Кроме того, поскольку активные серверные страницы -- это обычные Web-страницы с "вкраплениями" программного кода, их написание легко освоят все, кто знаком с HTML. Недостаток: относительная медлительность и повышенные требования к системным ресурсам.

Серверные сценарии подобны активным серверным страницам тем, что являются интерпретируемыми, однако представляют собой "чистый" программный код, без HTML-""примесей". Интерпретатор практически всегда представляет собой CGI-программу, однако ничто не мешает разработать его в виде расширения Web-сервера. Сценарии обычно пишутся на языке программирования Perl, специально предназначенном для обработки текста; также используются языки Python, JavaScript, VBScript и даже (как говорят) язык командных файлов MS-DOS. Фактически писать сценарии можно на любом языке программирования, для которого есть интерпретатор.

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

В табл. 15.1 приведены расширения файлов серверных программ.

Таблица 15.1. Расширения файлов серверных программ

Вид серверных программ

Подвид

Расширение

CGI-программы

-

exe

Расширения Web-сервера

ISAPI и NSAPI Модули Apache

dll Нет расширения

Активные серверные страницы

Серверные сценарии

ASP JSP

asp jsp

Язык Perl JavaScript VBScript Другие языки

pl, cgi js, cgi vbs, cgi cgi

Вот мы и рассмотрели, как Web-сервер обрабатывает (точнее, не обрабатывает) данные пользователя. Теперь переместимся в начало цепочки и рассмотрим, как Web-обозреватель отправляет данные пользователя серверной программе.

Как Web-обозреватель отправляет введенные данные

В начале этой главы мы говорили о том, что для сбора данных посетителя используются элементы управления, помещаемые на самих Web-страницах. Это обычные элементы управления, знакомые вам по приложениям Windows: поля ввода, кнопки, списки, флажки и пр. Посетитель сайта вводит в них данные и нажимает особую кнопку, запускающую отправку данных Web-серверу, а значит, и серверной программе.

Элементы управления, предназначенные для ввода данных посетителя, помещаются в форму. Форма - это особый элемент страницы, выполняющий собственно кодирование данных и пересылку их Web-серверу. (Можно сказать, что форма является родителем для элементов управления.) Сами же элементы управления только принимают данные от посетителя, но не кодируют и не передают их.

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

Например:

Здесь мы рассмотрели идеальный случай, когда значения каждого элемента управления содержат только допустимые с точки зрения протокола HTTP символы: буквы латинского алфавита, цифры, тире, подчеркивания и некоторые другие знаки. (Как вы помните, HTTP - протокол передачи файлов, используемый Web-сервером.) Если же вы передаете данные, содержащие недопустимые символы, скажем, пробелы или буквы русского алфавита, каждый такой символ будет представлен в виде шестнадцатеричного кода, которому предшествует знак процента, например, так (закодированные символы пробела выделены полужирным шрифтом):

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

Представленные в вышеуказанном виде данные впоследствии кодируются с использованием одного из предопределенных методов кодирования и отправляются по Сети серверной программе. Всем этим фактически занимается форма (но не элементы управления).

Сам процесс отправки данных начинается после того, как пользователь нажмет особую кнопку. Эта кнопка носит название Отправить (Submit -в англоязычных программах) и обязательно должна присутствовать в форме. Также в форме может присутствовать кнопка Сброс (Reset), обнуляющая введенные пользователем данные. Как правило, эти кнопки располагаются в самом низу формы.

Вы можете считать, что форма - это некое подобие обычного диалогового окна Windows-приложения, принимающего данные от пользователя, кодирующего их определенным образом и отсылающего основному окну. (Диалоговые окна Windows-приложений также обязательно имеют две кнопки: ОК и Отмена (Cancel).) Но если в случае обычного Windows-приложения программист должен явно задать, как будут шифроваться и пересылаться данные, в случае с Web-формой этого делать не нужно. Вам необходимо будет только задать три обязательных параметра:

  • интернет-адрес серверной программы, которая будет обрабатывать данные формы;
  • метод кодирования отправляемых данных;
  • один из двух методов отправки данных.

О методах отправки данных мы поговорим чуть позже. А сейчас выясним все о двух других обязательных параметрах формы.

Интернет-адрес серверной программы очень похож на интернет-адрес любого другого файла, например Web-страницы. Взгляните сами - так будет выглядеть адрес CGI-программы:

http: //www. somesite. ru/bin/program.exe Так - адрес расширения Web-сервера: http: //www.somesite.ru/bin/extension.dll Это - адрес активной серверной страницы:

http: //www. somesite . ru/asps/active_page . asp

А это - адрес программы-сценария, написанной на языке Perl:

http: //www. somesite. ru/scripts/perl_script.pl

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

Для кодирования передаваемых по Сети данных обычно используются три наиболее популярных метода: application/x-www-form-urlencoded, multipart/form-data и (значительно реже) text/plain. Возможно применение и других способов кодирования, но в абсолютном большинстве случаев используются три перечисленных. Вдобавок эти три метода кодирования поддерживаются большинством программ Web-обозревателей.

Примечание

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

В подавляющем большинстве случаев используется метод кодирования application/x-www-form-uriencoded. Кстати, именно он применяется по умолчанию, если метод кодирования не задан. Метод кодирования multipart/form-data используется, если вы собираетесь отправить на Web-сервер файлы; он обеспечивает соответствующее такому случаю преобразование двоичных данных. Последний метод - text/plain -- представляет данные в виде обычного текста, что может быть полезно, если данные формы будут отправляться по электронной почте (иногда применяется и такой способ передачи данных).

Итак, с кодированием данных разобрались. Остается выяснить, как же эти данные передаются по каналам Сети.

Как данные передаются по Сети

Как вы уже знаете, для пересылки данных по Интернету, да и по любой локальной или глобальной компьютерной сети, используется особый набор.правил, называемый протоколом. Протокол определяет, каким образом данные будут шифроваться и упаковываться для последующей передачи по сети. Естественно, что и передающая, и принимающая программы должны поддерживать один и тот же протокол, чтобы "понять" друг друга. (Иначе возникнет так называемая несовместимость по протоколу передачи данных, штука весьма неприятная.) Собственно, уже говорилось об интернет-протоколах и повторяться сейчас нет смысла.

Также вы знаете, что для пересылки по Сети Web-страниц и связанных с ними файлов (графических изображений, звуков, архивов и т. п.) используется протокол HTTP. Он же применяется и для передачи данных, причем для этого предусмотрены два метода передачи данных. Оба способа широко используются в интернет-программировании и имеют свои преимущества и недостатки. Давайте их рассмотрим.

Первый способ носит название GET по значению соответствующего параметра формы. При его использовании данные передаются как часть интернет-адреса в HTTP-запросе.

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

Возьмем, например, такой набор данных, приведенный чуть выше:

name1 = Ivan surname = Ivanovich name2 = Ivanov age = 30

Теперь подготовим его для пересылки по методу GET (сами данные выделены полужирным шрифтом):

http://www.somesite.ru/bin/program.exe?name1=Ivan&surname2=Ivanovich&name2=Ivanov&age=30

Как видите, пересылаемые по методу GET данные помещаются в самый конец интернет-адреса и отделяются от него вопросительным знаком. При этом пары "имя" = "значение" отделяются друг от друга знаком "коммерческое и" ("&"). Все очень просто и наглядно.

Такая простота и наглядность представления данных - основное преимущество метода GET. Как говорится, все на виду. Также значительно упрощается отладка Web-страниц: поскольку передаваемый Web-серверу адрес отображается в строке адреса Web-обозревателя, вы всегда сможете увидеть, что именно было передано. (Однако, как вы понимаете, конфиденциальные данные таким методом не передашь - их увидят все, кто стоит за вашей спиной.)

http://www.mysite.ru/bin/choose.exe?chapter=3

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

К несчастью, метод GET обладает огромным недостатком: с его помощью невозможно передавать большие объемы данных. Это происходит из-за ограничения, накладываемого стандартами на длину интернет-адреса: не более 256 символов. Вычтите отсюда длину собственно адреса серверной программы - и вы получите максимально допустимый размер ваших данных. Второй недостаток метода GET - обратная сторона его достоинства. Данные, пересылаемые им, открыты для всеобщего обозрения и могут быть легко прочитаны в строке адреса Web-обозревателя.

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

Метод POST передает данные серверной программе все в том же HTTP-запросе, но уже не частью интернет-адреса, а в виде так называемых дополнительных данных. Поскольку размер дополнительных данных не ограничен (по крайней мере, он может быть очень велик), вы можете передавать все, что угодно, в каких угодно количествах. В частности, именно этим способом Web-серверу могут передаваться даже файлы.

Достоинства метода POST: отсутствие ограничения на объем передаваемых данных и "невидимость" их. Недостатки: сложность расшифровки данных и трудность отладки. Методом POST передаются, например, анкетные данные, адреса покупателей в электронных магазинах, литературные произве дения на сайты http://www.stihi.ru и http://www.proza.ru и т. п. В общем, то, что имеет большие объемы.

Как говорят, комитет WWWC намерен вообще со временем отказаться от метода GET и все данные передавать с помощью метода POST. Пока что метод GET просто объявлен не рекомендованным для использования во вновь создаваемых сайтах, реально же он еще поддерживается Web-обозревателями.

Вот мы и выяснили все о серверных программах. Ну, может, не все, но пока нам этого достаточно. Теперь поговорим о том, насколько полно все это поддерживается Dreamweaver MX.

Серверное программирование - подход Dreamweaver

Трудно ли писать серверные программы? Да, трудно. Вероятно, даже труднее, чем Web-страницы.

Однако вспомните, часто ли нам приходилось писать HTML-код вручную? Совсем редко, не правда ли? А все потому, что Dreamweaver заботливо оберегал нас от этого, предоставляя удобный интерфейс для визуального создания страниц. Мы просто писали текст, форматировали его, помещали на страницу изображения, таблицы, применяли к элементам страницы поведения и т. п. Одним словом, чувствовали себя комфортно.

И неужели нам теперь придется писать серверные программы вручную?! Нет, совсем не обязательно.

Уже упоминалось, что Dreamweaver предоставляет неопытным пользователям и вообще тем, кто не хочет иметь дела с JavaScript-кодом, так называемые поведения. Поведение - это уже готовый сценарий, написанный профессиональными программистами и помещаемый в код Web-страницы самим Dreamweaver после того, как пользователь выберет это поведение в меню поведений панели Behaviors. Пользователю не надо заботиться о том, что в определенное место кода страницы необходимо поместить сценарий, выполняющий то или иное действие, ему не нужно будет проверять этот сценарий на наличие ошибок и согласовывать его с другими сценариями. Все это за него делает Dreamweaver.

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

Конечно, если вы хотите реализовать какие-то хитроумные действия, вам придется писать серверные страницы "врукопашную". Но, согласитесь, такое бывает нечасто.

Итак, мы выяснили две вещи. Во-первых, Dreamweaver MX поддерживает создание серверных Web-страниц. Во-вторых, для помещения в них сценариев используются хорошо знакомые вам поведения. Dreamweaver предлагает большой набор поведений для серверных сценариев, которых вам хватит на первых порах.

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

  1. ASP. Эта технология вам уже знакома.
  2. ASP.NET. Дальнейшее развитие ASP.
  3. PHP. Бесплатная технология, распространяемая с открытыми исходными текстами. Довольно популярна и часто используется с бесплатными же Web-серверами, например Apache.
  4. Macromedia ColdFusion. Собственная разработка фирмы Macromedia.

Какую же из них выбрать? Ведь нам надо будет создавать примеры Web-страниц.

Давайте выберем ASP. И вот почему.

Для того чтобы работать с серверными страницами, нам понадобится Web-сервер. Без него серверные страницы просто не будут работать. А, возможно, вы знаете, что со всеми более-менее новыми версиями Windows поставляется небольшой Web-сервер. В системах Windows 95/98/ME это Personal Web Server, а в Windows NT/2000/XP - Internet Information Server. Его возможностей нам вполне хватит для экспериментов с серверным программированием.

Так вот, этот Web-сервер полноценно поддерживает технологию ASP. Вы можете писать активные серверные страницы и выполнять их под ним. И вам не придется загружать никаких дополнительных компонентов - все, что вам нужно, уже включено в состав дистрибутивного комплекта Windows. Вот поэтому и был выбран ASP.

Технологию ASP.NET пока что не поддерживает практически ни один Web-сервер; фирма Microsoft пока что не выпустила ни один продукт с поддержкой этой технологии. Для работы с PHP-страницами вам придется искать и загружать по Сети довольно большой дистрибутивный комплект, содержащий обработчик РНР, а потом долго его настраивать. Что касается технологии ColdFusion, то вряд ли вы в состоянии выложить за нее несколько тысяч долларов. Так что вариантов у нас практически нет.

Введение в базы данных

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

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

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

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

На рис. 15.1 приведен пример такой таблицы. Как видите, эта таблица имеет три поля:

  • NAME - название технологии создания серверных страниц, текстовое;
  • PRICE - цена программы-обработчика, числовое;
  • USING - поддерживается ли эта технология в настоящее время, логическое ("да-нет").

Кроме того, эта таблица имеет четыре записи, соответствующие технологиям, поддерживаемым Dreamweaver MX: ASP, ASP.NET, PHP и ColdFusion.

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

Пример таблицы, входящей в базу данных

Как получить доступ к отдельному полю, вы уже знаете, - по его имени. А как получить доступ к нужной записи?

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

Также программа может использовать поиск нужной записи по какому-либо критерию. Очень часто такой поиск выполняется по значению ключевого поля.

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

В общем случае, последовательность работы с данными, содержащимися в базе, выглядит так:

  1. Программа открывает базу данных, выполняя операцию открытия. Это необходимая операция, без которой невозможно получить доступ к базе.
  2. Программа открывает нужную таблицу базы. После этого процессор возвращает ей так называемый набор записей (по-английски -- recordset), с которым и работает программа.
  3. Программа выполняет собственно работу с данными.
  4. Программа закрывает таблицу, после чего процессор убирает соответствующий этой программе набор записей из памяти.
  5. Программа закрывает базу данных, разрывая все связи с ней.

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

В последнее время большую популярность- приобрели серверы баз данных. Это обычные процессоры данных, но реализованные в виде серверных программ и работающие на серверных компьютерах. Их преимущества перед обычными процессорами данных:

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

Чтобы получить доступ к серверу баз данных и самим данным, клиентская программа посылает ему особые команды. Для составления таких команд был разработан язык описания запросов SQL (Structured Query Language -язык структурированных запросов). С помощью команд, составленных на этом языке, клиентская программа может открыть нужную таблицу, считать данные, добавить, изменить, удалить запись и, в конечном счете, закрыть базу данных, когда нужда в ней отпадет.

Серверы баз данных применяются сейчас очень часто, а в Web-программировании - почти повсеместно. К наиболее популярным можно отнести Oracle, Microsoft SQL Server, Sybase, мощнейший IBM DB2, Borland InterBase (в России он продается под названием IBase), набирающий популярность PostgressSQL и бесплатный сервер MySQL, распространяющийся с открытыми исходными текстами. Последний сервер, кстати, очень часто используется в связке с Web-сервером Apache и технологией серверных страниц РНР.

На этом рассказ о базах данных и о серверном программировании можно считать законченным.

Уже говорилось, что отправку данных серверной программе выполняют особые элементы Web-страниц - формы. Именно о формах и о работе с ними в Dreamweaver мы с вами будем говорить в следующей главе. А уже потом перейдем собственно к серверному программированию.

Заранее признателен за комментарии, оценки и поправки (с учетом, что целевая аудитория - чайники).

Если всем пользователям при любых обстоятельствах требуется показывать одно и тоже, то соответствующий файл можно просто положить на сервер, но обычно этого недостаточно и хочется какого-то разнообразия. В таком случае на сервере нужно запустить программу, которая будет создавать HTML-текст необходимый в данном конкретном случае. Написание этих «серверных» программ (скриптов) и есть в общем-то основное дело веб-разработки, именно в них обычно скрывается 90% сложности и стоимости любого проекта. Т. к. программа выполняется на нашем сервере, а не на компьютере пользователя, то выбор инструментария полностью за нами и нет какого-то одного языка, на котором такие программы пишутся.

Первое и самое принципиальное решение, которое следует принять - операционная система нашего сервера. Теоретически это может быть что угодно, на практике в России в 93% случаев используют Unix, в 6.99% - Windows, в 0.01% - что-то иное. Я не совсем объективен, но не вижу ни одного аргумента в пользу Windows и два в пользу Unix, соответственно рекомендую всегда выбирать его. Аргумент первый: то, что более распространено, всегда удобнее, проще найти хостинг, проще найти специалиста, проще найти готовое решение какой-то подзадачи. Аргумент второй: стоимость лицензий на Windows/MS SQL/...; деньги там не запредельные, но всё же отличные от нуля. Если в качестве ОС мы выбрали Unix, то следующий естественный вопрос - какую его реализацию использовать - абсолютно незначителен и может быть решен исходя из личных предпочтений системного администратора.

Второе принципиальное решение - язык программирования. Выбор тут достаточно велик. Во-первых, есть целый класс языков, идеально подходящих для типичных задач web-программирования (а один из них специально для него и придуман) - "скриптовые языки". Сейчас это как минимум PHP, Perl, Ruby и Python. Именно на них написано подавляющее большинство сайтов от простейших интернет-магазинов до vkontakte.ru, например. По возможностям, удобству, производительности, средствам разработки, каким-то другим теоретическим показателям они примерно равны между собой, основная разница в наличии программистов. Прямо сейчас замеренные показатели рынка таковы: на 100 резюме PHP-программистов в России приходится 10 Perl и по 2-3 Ruby и Python-резюме. С другой стороны, из всех людей, которые называют себя PHP-программистами, к коду на пушечный выстрел нельзя подпускать 80%, для перловиков этот показатель в районе половины, а для Ruby и Python и того меньше. Понятно, что первые цифры объективны и взяты с рабочих сайтов, а вторые условная субъективная оценка и прямо перемножать их нельзя, но в любом случае, количество и программистов, и хороших программистов упорядочено именно в таком порядке: PHP, Perl, Ruby или Python, а средний их уровень в прямо противоположном. Таким образом, если у нас промышленный проект, с большим количеством разработчиков и текучкой кадров, то из Web-языков выбирать нужно PHP (допустимо использование Perl в случае каких-то очень важных локальных причин). Если же проект короткий, программист точно будет один и не будет меняться никогда, то выбор можно доверить ему, при этом выбор Ruby/Python может даже оказаться оптимистичным фактором.

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

Язык C. Язык, требующий максимальной аккуратности программиста, наиболее сложный в поиске ошибок, с наименьшим количеством доступных готовых решений и с самой низкой скоростью разработки. Все эти минусы он компенсирует только одним плюсом: производительностью, которая на несколько порядков лучше производительности PHP и его аналогов. В принципе, железо сейчас дешевое, а рабочая сила дорогая, плюс этот важен достаточно редко. Условно, если в проекте предполагается менее миллиона показов в сутки, то про C можно забыть смело, но, если показов больше, о нем следует только думать, а не принимать безоговорчно. На C написан, например, счетчик liveinternet.ru.

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

Язык Java. С технической точки зрения отличается от C++ примерно так же, как C++ отличается от C. Т. е. переход от C++ на Java это потеря ещё половины порядка производительности, но новый выигрыш в скорости разработки и библиотека готовых решений уже соизмерима со скриптовыми языками. С точки зрения социальной, количество программистов на Java меньше и количества программистов на C++, и количества программистов на PHP, при этом они в среднем дороже и, на мой субъективный взгляд, в среднем хуже тех и других. Причина такого странного расклада - в довольно большом рынке Java-разработки корпоративных систем, который с одной стороны поднимает зарплаты, а с другой прививает свою культуру и подход к программированию, который только вреден в вебе. В итоге, я не вижу ни одной ситуации, когда применение Java в веб-разработке было бы обосновано. (Но тем не менее odnoklassniki.ru написаны именно на Java и успешно работают.)

Если мы успели совершить ошибку и выбрали в качестве операционной системы Windows, то кроме перечисленных языков (все они в принципе больше ориентированы на Unix, но могут быть использованы везде) появляются ещё два варианта: это VBScript (некий аналог PHP) и C# (аналог Java). Т. к. я не вижу выигрыша от Windows, то и их рекомендовать не могу.

Перечисленными вариантами многообразие серверных языков программирования не ограничивается, но суммарная популярность всего остального близка к нулю и рациональных причин для выбора экзотики я не знаю.

Все существующие (по крайней мере все популярные) инструменты универсальны. На каждом из них можно реализовать абсолютно всё что угодно, вопрос только в том, что с некоторыми инструментами это будет быстрее и дешевле, а с другими дороже и медленнее. В принципе, никто не запрещает использовать в одном проекте два разных серверных языка, но обычно это приводит к ухудшению управляемости проекта - мы зависим от двух специалистов (или двух групп специалистов) вместо одного, которые кроме собственно проектной работы должны тратить усилия на согласование как чисто социальное (общение между собой), так и техническое. Единственное оправдывающее себя исключение это связка одного из скриптовых языков с кем-то из пары C/C++. «Поверхностная» часть кода, отвечающая за интерфейс, пишется на скриптовом, а наиболее критичная к производительности внутренняя - на С или С++. При этом соотношение между частями в разных проектах может быть совершенно разным. Например, ulov-umov.ru представляет из себя очень алгоритмически сложный C++ проект, реализующий по сути собственную поисковую систему и небольшую Perl-обертку, рисующую пользовательский интерфейс из буквально 10 страниц. А внутри полностью PHP-шного readme.ru есть один маленький C-шный модуль, который по готовым данным быстро-быстро рисует информеры. Важно, что производительный язык всегда «внутри», а уж какую долю от объёма он занимает - зависит от локальных факторов.

Чем клиентские языки веб-программирования отличаются от серверных.

Дата: 2012-10-04

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

Сервер – это тот компьютер, на котором работает сайт в Интернете (хранятся файлы и папки сайта). Еще под термином Сервер понимают специальную программу, установленную на компьютере, которая обрабатывает запросы браузера пользователя к любому web-документу (например, ).

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

Клиентские языки.

Клиентские языки выполняются на компьютере пользователя (клиента). Если говорить более точно, то их выполняет сам браузер. Обычно клиентские языки встраиваются в html-код web-страницы. Таким образом, чтобы увидеть код, достаточно открыть веб-страницу с помощью любого текстового редактора или браузера.

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

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

Кроме того, раз любой пользователь может очень легко просмотреть код программы, то о безопасности можно тоже забыть. Если Вы захотите закрыть доступ к некоторым файлам, с помощью таких языков, это вряд ли удастся. Очень просто просмотреть HTML – код web-страницы, чтобы узнать всю защищенную информацию и пароли.

Однако, раз клиентские языки добились такой популярности, то у них должны быть и преимущества. Да, преимущества есть и еще какие!

1) Они не отправляют данные на сервер, что делает их работу значительно быстрей.

2) Не требуется никакого дополнительного программного обеспечения, все необходимое есть в браузере клиента.

3) За пользование серверными языками компания, предоставляющая хостинг, требует денег (платный хостинг), а за клиентскими нет.

Самыми распространенными клиентскими языками являются: JavaScript и VisualBasicScript (VBS) . Для того, чтобы браузер мог их понимать и выполнять в него встроен специальный инструмент – интерпретатор.

JavaScript , разработан компанией Netscape и первоначально использовался только для браузера Netscape Navigator . В настоящее время этот язык получил очень большую популярность. VisualBasicScript (VBS) это аналог клиентского языка от компании Microsoft .

Как уже говорилось ранее, все эти языки работают в обычных браузерах без всяких дополнительных модулей и плагинов. Самые распространенные браузеры это: Internet Explorer, Opera, Mozilla и др.

Серверные языки.

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

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

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

Наибольшую популярность, среди серверных языков получили: и Perl .

Т.к. серверные языки взаимодействуют с удаленным компьютером (сервером), возникает необходимость где-то хранить результаты этого взаимодействия. Возникает вопрос: как и где хранить эти данные?

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

Это своего рода библиотека, где вся информация аккуратно разложена по полочкам. Но просто одной БД еще не достаточно. Когда информации становиться много, найти то, что нам необходимо становиться очень трудно, не говоря уже, уже о том, чтобы всю информацию обработать или извлечь только нужные данные. Так почему бы не поручить это компьютеру? Так и поступили. В настоящее время БД успешно обрабатываются компьютерами. Системы, которые за все это отвечают, называются Системами Управления Базами Данных (СУБД) .

  • Перевод
  • Tutorial

Дорога длинна и трудна, но интересна и полезна!

Статья задумывалась как практическое руководство для желающих стать профессиональным веб-разработчиком. Я уже более 20 лет пишу код для веба. Я ежедневно работаю с веб-разработчиками и помогаю им. В статье я опишу, что вам нужно выучить, когда вам нужно это выучить и где взять информацию (чаще всего даже бесплатно). Затем я дам совет по получению реального опыта, и что самое важное – по получению денег за написание кода.

По статье разбросано множество ссылок на бесплатные и важные ресурсы. Для простоты я собрал их в PDF и разбил по категориям. Мне не платят за упоминания сайтов, ссылки на которые я привёл – я всего лишь хочу порекомендовать вам лучшие ресурсы, чтобы помочь вам достичь вашей цели.

Что нужно помнить:

1. Статью разрешается пролистывать

Руководство может помочь вам вне зависимости от вашего положения на дороге к профессиональной разработке. Прокрутите его к тому заголовку, который лучше всего описывает ваше сегодняшнее положение, и читайте оттуда. Если вы только начали этот путь, или пока размышляете об этом – последуйте совету Короля из «Алисы в стране чудес»:

Начните с начала, и продолжайте, пока не дойдёте до конца; и там уже остановитесь.

2. Попробуйте всего понемногу, а затем выбирайте специализацию.

Деньги – не самое важное. Вам необходимо ЛЮБИТЬ ваше занятие! Но вы не узнаете, что вам нравится, пока не попробуете.


Найдите свою страсть, а потом монетизируйте её

Руководство поможет вам ознакомиться с как можно большим количеством областей веб-разработки как можно быстрее. А потом поможет вам выбрать специализацию в той области, что вам понравилась. Сначала вы не достигнете совершенства ни в чём – вы выучите основы, и потом продолжите изучение. Найдите свою страсть, и я покажу вам, как двигаться дальше.

Я решил писать код. Мне нравится веб. Я не знаю, с чего начать


У вас всё получится!

Поздравляю! Это серьёзный первый шаг и начало чего-то весьма захватывающего. Но это может оказаться и очень сложным. Не волнуйтесь, я помогу.

Сначала вам нужно быстро познакомиться с основами всех областей веб-разработки («полный цикл»). Обучение будет разнообразным, но неглубоким. Это нужно для того, чтобы найти область, которая вам нравится, а также приобрести основные навыки в разных областях. Тогда вы сможете понимать и работать с большим набором задач, вне зависимости от того, на чём вы остановите свой выбор.

Изучите основы HTML

Язык разметки гипертекста, Hypertext Markup Language (HTML), контролирует содержимое и разметку того, что вы видите в браузере. Начав с него, вы получаете интерфейс пользователя, с которым можно взаимодействовать, и видите результаты работы своего кода. При изучении более сложных языков его важность будет возрастать. Вам ведь не нужно кодить вслепую.

Вот, что вам нужно изучить на тему HTML:

Я уже знаю основы HTML

Круто! Это очень важный шаг. Теперь изучите основы JavaScript.

Изучите основы JavaScript

JavaScript – язык веба, и все основные браузеры (Chrome, Firefox, Safari, IE, множество других) поддерживают его. Каждый сайт, каждое веб-приложение, которым вы пользовались, скорее всего, содержит огромное количество JS-кода. Не говоря уже о том, что язык набирает популяность и на других платформах – сервера, настольные компьютеры, другие устройства.

Пока вам нужны основы, и для этого подойдут следующие ресурсы:

Я знаю основы JavaScript и HTML

Потрясающе! Теперь добавим к вашим навыкам CSS

Изучите CSS

CSS, или Cascading Style Sheets (каскадные таблицы стилей). Используются для настройки внешнего вида элементов HTML на странице. Ознакомьтесь с бесплатным обучающим материалом от Mozilla, а затем обращайтесь к ресурсу CSS-Tricks для решения самых сложных проблем (справа вверху есть поиск).

Переходим к бэкенду

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

Языков для бэкенда масса, но поскольку вы знакомы с JavaScript, я порекомендую изучить использование Node.js. Он позволяет запускать JS-код на сервере, а не в браузере.

В дополнение к этому вам необходимо изучить Express и MongoDB.

Express
Это библиотека, с помощью которой Node.JS может работать веб-сервером (слушать запросы от страниц и отправлять им ответы).
MongoDB
Это база данных, позволяющая вам хранить и извлекать информацию.

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

Мне нужно выбрать между «фронтенд», «бэкенд» и разработкой полного цикла

После того, как вы попробовали оба варианта разработки, настало время делать выбор. Если вы не успели их попробовать – обратитесь к предыдущему разделу статьи, чтобы заполнить пробелы в ваших знаниях.

К этому моменту вы писали два типа кода. Один предназначен для взаимодействия с пользователем, другой – с данными. Что вы предпочитаете?

Взаимодействие с пользователем? Поздравляю, вы фронтенд-разработчик!

Взаимодействие с данными? Поздравляю, вы бэкенд-разработчик!

Оба? Поздравляю, вы разработчик полного цикла!

Ничего не понравилось? Поздравляю, веб-разработка – это не для вас. Возрадуйтесь, что вы поняли это сейчас, и не потеряли кучу времени и денег. Не готовы сдаваться? Может, вам не попался язык, который пришёлся бы вам по душе? Попробуйте изучить другие языки в разделе «Я хочу быть бэкенд-разработчиком».

Я хочу быть разработчиком полного цикла

Круто. Вам нужно ознакомиться со всем содержимым разделов «Я хочу быть бэкенд-разработчиком» и «Я хочу быть фронтенд-разработчиком».

Я хочу быть фронтенд-разработчиком и я знаю основы JavaScript, HTML и CSS

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

К этому моменту вы уже должны знать основы HTML. В противном случае вернитесь к разделу «Изучите основы HTML».

Изучите промежуточный и продвинутый HTML
Ознакомьтесь с обучающим материалом по промежуточному HTML, а затем – по продвинутому .
Изучите продвинутый клиентский JavaScript


Отличная серия книг по JS, при этом бесплатная

Для поднятия вашего уровня владения JavaScript, я рекомендую серию книг «You Don’t Know JS» за авторством Кайла Симпсона. Автор выложил всю серию в онлайн совершенно бесплатно:

Кроме того, вашим лучшим другом должен стать и MDN JavaScript .

[Также совершенно бесплатно вам доступен превосходный перевод отличной книги "Выразительный JavaScript " - прим.перев.]

Знать «троицу фронтенда», HTML, CSS и JavaScript – это, конечно, здорово. Но для зарабатывания денег придётся вам познакомиться с некоторыми фреймворками.

Изучите jQuery
Это самая популярная библиотека JS всех времён. Хотя из-за некоторых новых фреймворков важность jQuery чуть поуменьшилась, если вы ищете работу, велика вероятность, что jQuery будет присутствовать в описании необходимых навыков (и упоминаться на собеседовании) ещё много лет.

Рекомендую изучить jQuery при помощи материалов FreeCodeCamp – это быстрый и эффективный метод. После этого отправляйтесь на официальный обучающий сайт – там вы найдёте дополнительные инструкции.

Изучите популярный JS-фреймворк
Фреймворки делают работу с определённым языком или технологией легче, поскольку решают наибольшие проблемы, существующие у выбранной технологии. JavaScript очень благотворно повлиял на разработку и популяризацию фреймворков.

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

Во время написания этой статьи следующие фреймворки пользовались популярностью:

Выбрав наиболее подходящий фреймворк и хорошенько ознакомившись с ним, стоит изучить идущий в паре с ним CSS-фреймворк. Два крупнейших игрока на этом рынке сегодня – Bootstrap и Material Design.

Bootstrap
Bootstrap сделали разработчики Twitter, и он уже довольно взрослый и популярный. Версии Bootstrap существуют для Angular, Angular 2 и React.
Material
Material – это набор правил дизайна, разработанный в Google. Он набирает популярность, существуют его версии для Angular и React. Поскольку Angular – это тоже детище Google, сочетается Material с ним превосходно.

Вот вам несколько ссылок:

Поздравляю! У вас есть ключевые навыки фронтенд-разработчика!


Вы только посмотрите на него!

Я хочу быть бэкенд-разработчиком

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


TIOBE Index of Programming Languages, www.tiobe.com/tiobe_index?page=index

Концентрируйтесь на языках, чьи названия я обвёл зелёной рамкой. Если вы не знаете их, начинайте сверху таблицы и идите вниз. Останавливайтесь, когда найдёте то, что вам нравится, и копайте вглубь!

Если вы знакомы с одним из отмеченных зелёным цветом языков, и он вам нравится – концентрируйтесь на нём.

Подкачайте необходимые для интервью умения
Вам нужно подготовиться не только к написанию кода. В хорошей статье с Life Hacker описано много полезной и ценной информации.
Главное – закрепиться на рынке
Не сильно переживайте насчёт получения работы мечты у работодателя мечты с зарплатой мечты. Сначала просто добейтесь получения работы, где вы будете писать код за деньги. Получив больше опыта, сможете планировать следующий шаг.
Хочу быть фрилансером
Сам себе хозяин – это хорошо, но это одновременно и огромное давление, и большие сложности. Лучший источник информации по фрилансу из всех, что я видел - DoubleYourFreelancing.com . У него есть серия статей , которые помогут вам стать фрилансером лучше, чем это получилось бы у меня. Читайте.

Ещё один вариант, если вы в себе уверены – сервис Toptal . Они принимают лишь 3% из всех, кто подаёт заявки, и этот процесс очень сложен, но если вы попадёте туда – у вас будет доступ к хорошо оплачиваемым работам, над которыми вы сможете трудиться удалённо.

Я начал работу, но чувствую, что зашел в тупик
Понимаю. Это нелегко, и если кто-то говорил вам обратное – он либо этим не занимался, либо пытается выманить у вас деньги. Если вы чувствуете, что зашли в тупик, попробуйте следующие варианты:
Освежите ваше первоначальное намерение
Спросите себя, запишите на бумаге, почему вы решили идти по этому пути. В силе ли всё ещё ваш ответ? Если да – то зачем останавливаться? Вперёд!