С чего начать учится программированию с нуля чайнику?
В этой статье я постарался подробно разобрать, можно ли стать программистом с нуля самостоятельно и какие варианты есть для того, чтобы освоить программирование самостоятельно и начать зарабатывать на этом.
UPD : Тем, кто ищет, с чего начать изучать программирование с нуля в 2018 (или пока только собирается и приступит в 2019:)), сильно повезло благодаря книге Якова Крамаренко «Введение в разработку программного обеспечения». Я искренне рекомендую с ней ознакомится — она стоит того, чтобы обновить статью №1 по рейтингу Google и отзывам читателей для тех, кто изучает программирование самостоятельно.

Постарался дать самый лучший — на мой взгляд — путь. Предупреждаю — он не из легких! Дальнейшее прочтение может стоить вам многих часов интересных занятий:)

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

Если вы найдёте, чем дополнить эту статью, чтобы сделать её полезнее для людей — напишите в комментариях.

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

Книга по веб-программированию для начинающих

Версия 2016 года есть в переводе: https://courses.prometheus.org.ua/courses/Prometheus/CS50/2016_T1/about .

Лучше пройти курс на английском. И язык прокачаете, и информация посвежее. Хотя сильно курс не менялся — только в 2017 вместо PHP начал использоваться Python.

Прохождение курса займёт время, но даст довольно полное понимание, которое сложно иначе получить самостоятельно.

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

Лучший выбор в такой ситуации — на мой взгляд — начать изучать веб-разработку. Здесь ниже порог входа для новичков и есть возможность раньше начать выполнять несложные заказы.

Как самостоятельно стать программистом с нуля

Если бы я начинал с нуля изучать веб-разработку самостоятельно (понимая, что без вложения денег это более долгий путь), то сам себе я бы порекомендовал такой путь:

1. Разобраться в HTML и CSS

Хороший курс для базового освоения HTML и CSS: https://learn.shayhowe.com/html-css/ (English) или https://webref.ru/layout/ learn-html-css (перевод).

После этого стоит посмотреть на возможности Bootstrap, который стал стандартом де-факто для ускоренной разработки веб-приложений: http://getbootstrap.com/

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

На этом тоже можно зарабатывать — как на фрилансе, так и работая в ИТ-компании, которая специализируется на веб-разработке.

Но раз мы решили стать программистом — двигаемся дальше!

2. Познакомиться с jQuery

Если понравилось — можно продолжить разбираться с frontend и начать изучать Javascript .

Если следом пойдет https://angularjs.org/ или http://backbonejs.org/ — то это путь во фронт-енд разработку. Хорошая специальность, тем более, что такие знания пригодятся любому программисту, который выбрал веб-разработку.

Мой совет — пока остановиться на jQuery и двигаться дальше.

3. Освоить серверный язык программирования

Тут выбор большой. Самые перспективные языки программирования — Ruby, Java, Python, Node.JS (Javascript для сервера).

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

Хороший вариант — язык программирования Python и Django

Плюс — Python и Django научат вас «правильному» программированию. Python стабильно входит в ТОП5-10 самых востребованных языков, а хорошие специалисты в Python одни из самых высокооплачиваемых программистов. Python одновременно простой и понятный для начинающих программистов язык программирования, и при этом используется во многих крупных компаниях и на больших проектах.

Для самостоятельного освоения прочтите «Python для детей» Джейсона Бриггса или посмотрите:

Среди других материалов рекомендую Learn Python The Hard Way . книгу «Простой Python. Современный стиль программирования». И, конечно The Python 2 Tutorial и The Python 3 Tutorial .

Django — возможно лучший фреймворк для веб-разработки

Лучший инструмент на все случаи жизни очень сложно найти. Django имеет все шансы стать таким инструментом для веб-разработки.

С чего начать для изучения Django:

Начните с официальной документации, там очень хороший tutorial: https://docs.djangoproject.com/en/2.1/intro/

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

Вариант №2 — PHP и WordPress

Другой путь — начать с PHP и работы с популярными CMS. Если вы изучаете программирование сами и хотите быстро начать работать — начните с PHP.

Многие считают PHP «не совсем настоящим» языком программирования и для этого есть основания. PHP редко используется в крупных веб-приложениях и заточен только для веб — использовать его в других областях не получится.

С другой стороны — PHP лидирует по количеству запущенных в мире сайтов. На нем основаны самые популярные CMS (системы управления сайтами).

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

Хорошо разобравшись с этим, уже можно найти работу. Под PHP и WordPress очень много сайтов, поэтому работы хватит всем.

Как начать зарабатывать программистом

Многие представляют работу программиста-фрилансера так:

На самом деле это выглядит примерно так:

Если вы готовы к работе программиста и ищете способ зарабатывать — добро пожаловать на фриланс! Фриланс-биржи позволят вам найти простые заказы (возможно почти бесплатно на первых порах) — чтобы получить практику. Как правило, работа в ИТ-компании может быть прибыльнее, если вы просто ищете работу программиста.

Уже после пункта 2 — освоив HTML, CSS и jQuery — можно идти на фриланс биржи и брать несложные заказы, нарабатывая профиль.

Знаете английский? https://www.upwork.com/

Совсем нет, даже со словарем? http://freelance.ru/

К тому времени, когда вы сможете самостоятельно делать сайты, вам будет проще найти клиентов — будут отзывы и опыт.

Быстрый путь в веб-разработчики

Исходя из моего опыта, на изучение программирования с нуля уйдет от 6 до 12 месяцев в лучшем случае, при этом 6 месяцев — это если вам кто-то помогает.

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

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

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

Как только почуствуете уверенность в том, что можете что-то создать — ищите компанию, где сможете развиваться дальше или клиентов.

HTML, CSS, Python и Javascript — это только базовые знания, первый этап. Дальше очень важна практика, изучение алгоритмов и инструментов для разработки.

Если есть вопросы — задавайте в комментариях! Надеюсь эта статья поможет вам сделать первый шаг. Успехов!

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

Первый шаг

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

Конечно, на теории дело не закончится, все полученные знания нужно пару десятков раз применить на практике — тогда они вобьются в вашу голову намного лучше, так что, даже есть после этого разбудить вас ночью, и спросить: «а как работает в css @keyframes?» — вы все подробно расскажете.

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

Тут в самом низу вы можете увидеть то, что будете изучать, если оплатите обучение.

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

Что должен знать веб-программист?

Итак, как видите, это:

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

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

    Где все это выучить?

    В моем понимании есть 3 основных способа обучаться на веб-программиста:

  • Читать бесплатные статьи и материалы в интернете, смотреть бесплатные видеоуроки и курсы. Так вы можете получить базу, но дальше начального уровня не продвинетесь!
  • Покупать платные курсы. Этот вариант избрал я, так как сайтостроение я изучаю не для работы на компанию, а на самого себя, поэтому меня устраивает обучение по курсам. 1 толковый курс в рунете стоит от 3 до 7 тысяч рублей. Лично я потратил на курс всего около 40-50 тысяч рублей и не жалею, т.к. уже получил много знаний, которые смог применить на практике и начать зарабатывать.
  • Купить полноценное удаленное обучение с наставником. Это самый дорогой вариант, который обойдется в 40-150 тысяч рублей. Конечно, в плане эффективности он является самым лучшим. Такое обучение, к примеру, можно купить в онлайн университете Geekbrains .

    • Хорошими площадками для получения базовых знаний по html, css, php и js будут Magisters.org , HtmlAcademy.ru и премиум раздел Web4myself.com (хоть он и платный, но доступ в него всего 500+ рублей в месяц, а уроков там тьма).

    Ну а наилучшим вариантом я вижу тот же Geekbrains — потому что здесь все платно и по серьезному, вас доводят до реальных результатов в виде созданных вашими руками сайтов, а не просто дают голую устаревшую теорию. Плюс там можно получить консультации реального наставника.


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

    По итогу можно получить такое приличное резюме:


    И такие навыки:

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

    Например, за одиннадцать месяцев Geekbrains обещает вас обучить таким технологиям: HTML/CSS, PHP, JS, NodeJS, AngularJS, Yii . С другой стороны, для того, чтобы найти простую работу или начать делать сайты для себя, вам необязательно знать все это. Я уже говорил, что является базой. Это html, css, php, javascript. Но дело в том, что с каждым годом требования к веб-разработчикам растут и если вы хотите серьезных результатов, так или иначе придется изучать современные технологии и тенденции.

    Курсы по PHP и фреймворкам


    На данный момент есть замечательный курс PHP7 и MySQL с нуля до гуру , который я прошел лично и даже написал о нем отдельный отзыв. Я считаю этот курс замечательным, в нем дается большая база по современному php.

    Книги тоже имеют право на жизнь. Для расширения своих знаний в любой сфере читать их полезно. И по php почитать можно много чего. Например, такое.

    Необязательно знать все

    Если вы изучили только javascript (а php — нет), то сможете работать front-end разработчиком, а если наоборот — попробуете свои силы в back-end . В общем-то, даже имея небольшие знания, уже можно что-то заработать на сайтостроении, но чем больше вы будете знать, тем больше ваш потенциал.

    Если разобраться, то каждый из нас ежедневно занимается программированием. Не верите? Но ведь вы устанавливаете будильник на своем телефоне на определенное время. Или задаете программу для стиральной машины, мультиварки.

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

    Программирование сегодня

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

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

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

    Одной из таких технологий является ASP.Net . Она построена на основе устаревшей платформы Asp с использованием одного из языков .Net. Чаще всего применяются C# и Visual Basic. ASP.Net является серверной технологией, применяется для построения сайтов и веб-сервисов:


    Но эта связка не является основной, используемой для построения современного виртуального пространства. Чаще всего для создания веб-ресурсов применяют язык программирования PHP и MySQL . Конечно, все эти составляющие «густо приправлены » CSS и HTML кодом.

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

    Веб-программирование

    В самом начале зарождения современного виртуального пространства использовался лишь один язык гипертекста (HTML ). Именно он является тем, с чего начинается веб программирование. Со временем возможностей его тегов и атрибутов для оформления веб-страниц стало мало. Поэтому был реализован специальный стилевой язык элементов CSS .

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

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

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

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

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


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

    И в ответ на запрос браузера клиента быстро извлекать данные, необходимые для генерации. Чаще всего используется система управления базами данных (СУБД ) MySQL . Это нужно учитывать при принятии решения о том, с чего начать web программирование.

    Теперь давайте подведем итоги по сказанному выше:

    • В основе любого сайта лежит HTML и CSS ;
    • Наиболее распространенным является динамический тип веб-ресурса;
    • Основным серверным языком является PHP ;
    • Кроме PHP в создании динамических веб-страниц используют СУБД MySQL .

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

    Прикладное программирование

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

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

    Наиболее перспективные языки программирования прикладного уровня:

    • C/C++ — то с чего начинают обучение программированию. Несмотря на свой солидный возраст, эти языки остаются актуальными и сейчас. Тем более что C является основным языком, на котором написана операционная система Windows :


    • C# — дальний потомок предыдущих языков. Входит в состав пакета .NET от Microsoft . Используется как в прикладном программировании, так и для создания веб-приложений на основе технологии asp.net ;
    • Java – кроссплатформенный язык. Основа, на которой базируется популярная сегодня мобильная операционная система Android. Разработка приложений под эту операционную систему является весьма перспективным направлением:

    Как изучать

    Если вы новичок и не знаете даже основ программирования, то изучение лучше всего начать с C или С++ . Большая часть остальных языков имеет схожий с ними синтаксис и структуру.

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

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

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

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

    Текст подготовлен на основе вебинара с участием Михаила Овчинникова из компании Badoo.

    Запись вебинара

    Экономия времени

    Ситуация на рынке

    Рассматривая общую картину рынка, можно выделить наиболее востребованные направления в IT-сфере:

    1. Frontend - самая «громкая» и быстроразвивающаяся отрасль, в которой постоянно меняются тренды. Опирается на язык программирования JavaScript и его фреймворки, такие как Angular.js, React.js, Vue.js и другие, а также язык разметки гипертекста HTML и таблицы стилей CSS.

    2. Web-development, а именно backend-разработка с использованием различных языков, например, PHP, Ruby и Python.

    3. Android/iOS-development - разработка под мобильные устройства на языках Java, Swift, Objective-C, C# (Xamarin), JavaScript (React Native) и других.

    4. .NET-development - разработка как десктопных приложений под операционную систему Windows на языке C#, так и серверных программ, в том числе веб-сайтов, с использованием технологии ASP.NET.

    5. Java-development - разработка кросс-платформенных приложений на языке Java, а также крупных высокопроизводительных систем с использованием технологии Java EE. Ее выбирают, когда нужны надежность, масштабируемость и гибкость.

    6. Game development - разработка игр под различные платформы.

    7. UI/UX - проектирование пользовательских интерфейсов.

    8. QA - обеспечение качества программного обеспечения и его тестирование.

    9. Embedded development - разработка программного обеспечения под «железо»: автомобили, бытовую технику и различные устройства с использованием низкоуровневых языков, таких как C и C++ со вставками ассемблера соответствующего процессора.

    Почему стоит идти в веб

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

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

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

    Сколько зарабатывает веб-разработчик

    Изучив сайты поиска работы, можно увидеть весь диапазон зарплат веб-разработчиков. Новичок, у которого меньше полугода опыта, может зарабатывать от30 000 до60 000 рублей. Средний специалист с хорошим стажем получает80 000–150000 рублей. Доход профессионала составляет150 000–250000 рублей. Вдобавок, многое зависит от страны, региона, выбранного языка и компании, предлагающей вакансию.

    Зарплаты frontend-разработчика от сервиса зарплат компании «Мой круг » на сайте habrahabr.ru (конец2017 года)

    Что нужно знать веб-разработчику

    Про веб-разработку и программирование бытует множество слухов и стереотипов. Мы поговорим в том числе и о них.

    Что веб-разработчику не требуется:
  • Знать математику - большинству программистов, которые профессионально занимаются созданием сайтов и веб-сервисов, достаточно знаний на уровне5 класса.
  • Иметь глубокие знания английского языка. Полсотни слов может вполне хватить.
  • Учиться несколько лет и заканчивать институт, чтобы освоить базовую веб-разработку. На деле ее освоение займет два-три месяца обучения.
    • Что понадобится для успешного старта:
  • Изучить базовые технологии создания сайтов - HTML и CSS - и понять принципы построения структуры сайтов. На это уйдет несколько недель.
  • Освоить сопутствующие технологии: редакторы кода либо IDE (интегрированные среды разработки), например Notepad++, Sublime Text, Brackets, WebStorm, PHPStorm. Эти инструменты сильно ускорят процесс разработки.
  • Знать о существовании фреймворков и готовых решений, которые упрощают и улучшают код. Например, для frontend-разработчика это фреймворк для верстки Bootstrap, библиотека языка JavaScript - JQuery, с помощью которой написано множество других полезных и нужных библиотек, и Simfony - PHP-фреймворк общего назначения, который облегчает взаимодействие с базой данных, задачи формирования HTML-кода и задачи принятия данных из запроса.
  • Не менее важно и умение правильно составлять поисковые запросы, пользоваться качественными и проверенными источниками информации.
    • Структура веб-сайта

    Для начала давайте выясним что такое сайт и из чего он состоит.

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

    Например, если бы наш сайт имел домен mysite123.com, то и папка, в которой он лежит, называлась бы так же и имела примерно такую структуру:

    Структура каталога сайта

    Когда в адресной строке браузера мы вводим адрес, например, yandex.ru, браузер обращается к серверу соответствующего сайта. Это то, с чего начинается взаимодействие с любой страницей в сети.

    В ответ на этот запрос на сервере yandex.ru начинают работать backend-технологии, например, PHP и MySQL. Они делают свою «серверную магию» и в ответ на запрос «покажи мне главную страницу» отдают обратно браузеру искомую страницу в виде HTML, CSS и JavaScript-кода. Браузер умеет распознавать этот код и в результате выводит в своем окне красивую, работающую «Главную».

    Ресурсы и инструменты для веб-разработки

    Для качественного и продуктивного освоения веб-разработки познакомимся с наиболее популярными источниками информации, а также некоторыми инструментами.

    HTML и CSS:
    • htmlbook.ru - самоучитель по HTML4, а также введение в HTML5, самоучитель CSS, введение в CSS3;
    • htmlacademy.ru - интерактивный курс по HTML5, основы CSS, множество бесплатных уроков;
    • webref.ru - самоучитель HTML, основы CSS, блочная модель CSS, текст в CSS, позиционирование в CSS, продвинутый CSS;
    • «Погружение в HTML5» Марка Пилгрима.
    JavaScript:
    • learn.javascript.ru - самый современный самоучитель по JavaScript;
    • Дэвида Флэнагана.

    После освоения этих технологий рекомендуется также изучить JQuery - самую популярную библиотеку JavaScript. В дальнейшем стоит познакомиться и с такими полезными библиотеками, как Slick, Owl Carousel, Magniffic Popup, Velosity.js, Tree.js и другими.

    Для ускорения написания кода и удобной работы с ним советуем использовать текстовые редакторы, такие как Sublime Text с плагином Emmet, редактором Notepad++, Brackets, IDE WEBStorm, PHPStorm и другими полезными инструментами.

    Для ускорения написания CSS-кода полезно будет научиться работать с препроцессорами CSS, такими как Scss, Sass, Less.

    Создаем простую веб-страницу

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

    Воспользуемся текстовым редактором Sublime Text3 и создадим в нем новый файл index.html.

    Файл index.html

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

    Добавим несколько элементов. Для каждого из них есть свой тег. Для начала создадим заголовок и дополним его текстом и кнопкой.

    Для добавления заголовка используется тег , для параграфа текста - тег

    А для кнопки - тег . Поместим эти элементы внутри блока с тегом .

    Моя первая страница

    Это моя первая страница

    Программирование - это просто!

    Показать

    Теперь обновим страницу. Как видите, элементы появились в окне браузера.

    Язык HTML, который мы использовали до сих пор, отвечает лишь за создание структуры страницы. Давайте попробуем немного стилизовать наши элементы: поменяем цвета заголовка и фона кнопки, а для текста параграфа изменим размер шрифта.

    Для изменения стиля элементов необходимо применить к ним CSS-правила. CSS-правила можно записать внутри блока с тегом .

    Нужный нам код выглядит так:

    h1 {color: violet;}

    p {font-size: 30px; }

    button {background-color: yellow;}

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

    Отлично. Теперь установим фон, а кнопку сделаем более заметной. Добавим следующие правила для кнопки и фона:

    background-color: orange;

    font-size: 30px;

    body {background-color: lightgray;}

    Пора дополнить все это великолепие картинкой. Добавим к существующим элементам тег , который и отвечает за отображение изображений на странице. Он включает такой атрибут, как src (от англ. source - источник), который указывает на путь к картинке. Наша картинка лежит на диске D.

    Так можно создавать множество элементов на странице, а затем с помощью CSS-правил придавать им нужные вид и расположение.

    Давайте сделаем так, чтобы при наведении курсора на кнопку она становилась белой, а текст внутри нее - оранжевым. За состояние элемента при наведении на него курсора в CSS отвечает псевдокласс hover. Добавим несколько правил для нашей кнопки и после этого попробуем навести на нее курсор.

    button:hover {background-color: white; color: orange;}

    Все сработало! Кнопка поменяла свой вид.

    Теперь попробуем сделать нашу картинку по умолчанию невидимой и устроим все так, чтобы она появлялась только по нажатию на кнопку. За видимость объектов отвечает CSS-свойство visibility. Установим ему значение hidden.

    img {visibility: hidden;}

    Как видите, картинка исчезла.

    Вернем нашу картинку и нажмем на кнопку «Показать». Ничего не произошло? Все потому, что мы еще не запрограммировали кнопку на выполнение действия. Здесь мы уже можем применить JavaScript.

    Зачем нужен JavaScript

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

    Обычно скрипты, кстати, как и CSS-правила, принято выносить в отдельный файл с расширением.js (для CSS - .css), а затем подключать этот файл к странице. Но в нашем примере мы вставим скрипт в раздел , точно так же, как делали это с CSS.

    Чтобы выполнить действие только с определенным элементом, в нашем случае с картинкой, зададим ей уникальный идентификатор с произвольным именем, например, cat.

    После чего создадим с помощью JavaScript функцию, которая будет возвращать картинку на экран, и дадим ей имя show. Вставим этот кусок кода в раздел .

    function show(){ document.getElementById("cat").style.visibility="visible";}

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

    Показать

    Теперь конструкция document.getElementById("cat") выполняет обращение к элементу по идентификатору cat, который прикреплен к нашей картинке. Укажем, что обращаемся к стилю элемента, а конкретно - к свойству visibility, и устанавливаем через знак «=» значение visible в кавычках.

    Если вы хотите, чтобы при нажатии на кнопку менялся и фон страницы, добавьте в функцию и этот код:

    document.body.style.background = "green";

    Как видите, и правда просто.

    Вместо того чтобы вручную менять свойства объектов в коде, JavaScript это сделал за нас.

    Как сайты хранят данные

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

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

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

    Существует много других языков для этих целей, но PHP в связке с MySQL - системой управления базой данных (СУБД) - считаются наиболее простым вариантом для освоения новичком.

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

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

    Заключение

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

  • Знание языков.
  • Умение пользоваться готовыми решениями, библиотеками и фреймворками.
  • Самопрезентация и работа с заказчиком.
  • Наличие хорошего портфолио и резюме.
  • Умение вникать в требования заказчика и работодателя.

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

    Сегодня многих интересует, можно ли научиться программировать с нуля.

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

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

    Cодержание:

    Шаг первый. Подготовка

    Нередко начинающие программисты не могут достичь успеха по той простой причине, что изначально не смогли правильно расставить приоритеты.

    Они представляют данное ремесло как что-то романтическое, динамичное – прямо какой-то постоянный экшн.

    В фильмах этот процесс показывается совсем не таким, какой он есть на самом деле.

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

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

    Так что если вы просто пропитались духом всевозможных кинолент и хотите самостоятельно начать «кодить», программирование – это явно не для вас .

    Вот вам правда о рассматриваемом ремесле – программирование это:

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

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

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

    Шаг второй. Выбор первого языка

    Существует огромное количество языков программирования. По некоторым подсчетам их число уже достигло нескольких тысяч.

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

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

    1 Pascal .

    2 C++ .

    3 PHP и все, что связано с веб-программированием, а также SQL (это система, предназначенная для работы с базами данных путем запросов).

  • Веб (разработка сайтов, онлайн систем и все, что с этим связано) – html (хотя его нельзя назвать полноценным языком программирования), PHP, Perl, Python, Ruby, Java, Groovy, а также технология ASP.NET.
  • Пользовательское ПО (всевозможные программы вроде справочников, браузеров, мессенджеров и тому подобное) – Delphi, C, C++, C#.
  • Пользовательское ПО для мобильных устройств – Java, Objective-C.
  • Машинные разработки (работы с микропроцессорами и другими устройствами, проектирование робототехники) – Assembler, модификации С.

    • Кто-то также может внести в этот список так называемое программирование 1С. Не верьте профанам и ничего не знающим людям! Это совсем не программирование.

    Когда вы познакомитесь с основами рассматриваемой работы, то поймете, почему так можно говорить.

    Выбирайте то, что вам больше всего понравится.

    Совет: Сделайте свой выбор сразу! Вы должны точно знать, в каком направлении будете развиваться и что изучать в дальнейшем.

    Большинство специалистов также советуют начать свое обучение с Pascal. Такой вариант позволит

    Вам написать самые простые программки и иметь общее представление о рассматриваемом ремесле в целом.

    Можно сказать, что Паскаль – это некий мост. Человек, который просто хорошо знает математику, может перейти через него в мир программирования.

    Внимание! В какую бы компанию вы не устроились после обучения, вас будут переучивать под себя. Поэтому вы должны просто понимать сам принцип написания программ. А для этого нет ничего лучше, чем Pascal.

    Шаг третий. Изучение компиляторов

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

    Собственно, все свои программы вы будете писать, и выполнять именно в компиляторах.

    Если вы решили последовать нашему совету и начать с Паскаля, то вам следует скачать Free Pascal. Этот компилятор абсолютно бесплатный и распространяется на официальном сайте .

    Как видим, выглядит он достаточно «старомодно», но программирование начинается именно с этого. Кстати, компилятор C++ выглядит практически так же.

    Называется он Turbo C++ (скачать его можно ).

    Что касается Паскаля, то существует также GNU Pascal, Turbo/Borland Pascal, TMT Pascal и Virtual Pascal. А для С++ можно использовать Borland C++, Visual C++, Dev C++, GCC и Eclipse.

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

    Вот список наиболее популярных на сегодняшний день компиляторов в зависимости от направлений деятельности:

      Что касается Delphi , то компилятор там так и называется. Существует также Embarcadero Delphi и некоторые другие модификации. Делфи 7 можно скачать на многих сайтах, к примеру, . Если вы выбрали C, C++ или C#, то вам нужна Microsoft Visual Studio. Загрузить ее можно прямо на официальном сайте производителя.

      Если говорить об Assembler и других языках, которые практикуются в робототехнике , то здесь сразу необходимо скачать MASM , если вы работаете на Windows. А вообще, в зависимости от выбранной вами сферы деятельности и компании, на которую вы устроитесь работать, компиляторы могут быть самыми разными. Некоторые фирмы пишут собственные решения для обработки кода. Поэтому, если вы выбрали робототехнику, лучше изучить соответствующие книги и делать все, как там говорится. Об этом мы еще поговорим.

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

    Вот наиболее популярные из них:

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

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

    А теперь приступим к написанию вашего первого шифра (кода). Сделать это можно даже без книг и длинных инструкций.

    Шаг четвертый. Первый код

    Для первого кода мы будем использовать первый язык и первый компилятор, который мы советовали выбирать выше. Это Паскаль и Free Pascal.

    Одна из самых простых программ пишется следующим образом:

    1 Скачайте Free Pascal по ссылке выше и запустите его на своем компьютере.

    2 Введите следующее: «program [название];» . То есть если вы хотите, чтобы программа называлась «hello», необходимо ввести «program hello;».

    3 Введите инструкцию «begin» . Это означает, что код, который в дальнейшем нужно будет выполнить, начался.

    4 Используем одну из самых распространенных в Паскале конструкций «writeln(‘[какой-то текст]’);» . Она просто выводит на экран текст. Который содержится в скобках и кавычках. Мы введем сочетание «Hello, world!» . Обычно свой путь в большой мир разработок ПО начинают именно с этого. Таким образом, следующая строчка будет выглядеть как «writeln(‘Hello, world!’);» .

    5 Чтобы закончить исполняемый шифр, введите «end.» (обязательно с точкой в конце).

    6 Теперь нажмите кнопку «F9» , чтобы запустить то, что написали. Вы увидите, как на экране появились слова «Hello, world!» . Это и требовалось!

    Чтобы начать свое знакомство с другими языками, в книгах обычно также приводятся инструкции по написанию «Hello, world!» , то есть инструкции, которая просто выводит такой простой текст на экран.

    Итак, вы осилили свой первый шифр! Начало положено. Теперь переходите к интенсивному обучению.

    Шаг пятый. Пройдите онлайн тренинг

    Преимущество онлайн уроков в том, что вы все видите наглядно, причем от начала до конца.

    Поэтому новичкам лучше все-таки начинать свой путь именно с онлайн тренингов. Вот лучшие курсы на русском языке:

    • Курс «Основы программирования» от Образовательного IT-портала GeekBrains . Здесь все рассказывается с самого начала, с самых азов. Вы сможете изучить историю, развитие данной отрасли, а затем постепенно стать ее частью. Тот же цикл тренингов можно скачать с торрента (вот ссылка).
    • Уроки от Школы программистов . Этот курс подойдет тем, кто ничего не смыслит даже в математике, не знает природу чисел, как представляется информация в компьютере и другие подобные моменты. То есть если вы считаете себя полным профаном, смотрите эти видеоуроки.
    • «Фундамент программирования» от EG Lab . Здесь расскажут о данном ремесле в целом, о разработке сложных задач и типах данных (всего три урока). Просмотр данных уроков будет отличным подспорьем, чтобы начать изучать какой-то конкретный язык в дальнейшем.

    После просмотра этих курсов, необходимо переходить на уроки, посвященные какому-то конкретному языку или отрасли, выбранной вами.

    Если вы знаете английский, это огромное преимущество, но только в том случае, если вы уже что-то знаете.

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

    Зато есть курсы для конкретных языков. К примеру, есть Learn Java Simply , C++ Programming Tutorial for Beginners , How to program in C# - BASICS и многое другое.

    Выбирайте тренинг в зависимости от направления своей деятельности.

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