Веб программирование с чего начать обучение самостоятельно
С чего начинается путь в веб-разработку
Юлия Голанцева, редактор-фрилансер, специально для блога Нетологии адаптировала статью Рика Уэста о том, с чего начинать, если вы хотите стать веб-разработчиком.
Итак, вы заинтересовались веб-разработкой и хотите стать веб-разработчиком? Поздравляем вас! Вы сделали отличный выбор.
Возможно, вы уже являетесь активным участником группы в Фейсбуке, сабреддита или другого онлайн-сообщества, посвященного кодированию — это отличные места для старта и поиска поддержки в выбранном вами занятии.
Если вы новичок, вам может быть интересно, с чего начать изучение веб-программирования. Поискав ответ на этот вопрос в Гугле, можно растеряться от обилия информации о языках, фреймворках и учебных ресурсах.
Но не волнуйтесь, вы не одиноки. Гугл может стать вашим лучшим другом, если его правильно использовать.
Начните с конца
Первое, что я рекомендую сделать, когда вы начинаете изучать веб-программирование — это определить чëткую конечную цель и помнить о ней.
Возможно, вы хотите поменять профессию. Или у вас есть интересная идея для создания приложения. Или вы просто хотите учиться ради развлечения.
Какова бы ни была ваша цель, важно понимать, зачем вы это делаете. Это понимание поможет сделать процесс обучения продуктивным и не даст забросить начатое.
Помните, какой сложной и далëкой вам ни казалась бы сейчас ваша цель, добиться ее вполне реально, если много и усердно работать.
Если у вас пока нет опыта, решите, что вам интереснее: бэкенд- или фронтенд-разработка. Позвольте мне кратко объяснить разницу.
Фронтенд — это то, что видит конечный пользователь, с чем взаимодействует на странице. Это весь дизайн, визуальные эффекты, схемы и образы, которые формируют пользовательский интерфейс.
Как правило, фронтенд-разработчиками становятся визуальные креативщики с отличными дизайнерскими навыками и страстью к созданию удобного и понятного пользователям продукта. Технологии, связанные с фронтенд-разработкой: HTML, CSS, jQuery и JavaScript.
Бэкенд — это та часть, которая взаимодействует с данными, хранит их и обрабатывает; это «начинка» сайта или приложения. Бэкенд разработчики, как правило, хорошо умеют решать поставленные задачи, логически мыслят и интересуются внутренней работой сайтов и приложений. Бэкенд-разработка связана с языками PHP, Python и Ruby.
Я сразу понял, что у меня нет склонностей к дизайну, который так привлекает многих во фронтенд-разработке. Однако мне легко принимать решения благодаря опыту в проектировании и строительстве. Решать задачи и выяснять, как всë работает, мне ближе, чем наводить красоту.
В любом случае, что бы вас ни интересовало, считаю, что начинать обучение программированию надо с основ HTML и CSS. Неважно, в какую область разработки вы в конечном подадитесь, вам все равно придется взаимодействовать с веб-страницами.
Так что прежде всего отправляйтесь на курсы «HTML и CSS» и получите представление об этих технологиях.
Вы начали путь в веб-разработку…
…теперь настало время практиковаться. Это может показаться сложным, когда вы работаете полный день, учитесь или заботитесь о семье и детях.
Однако постоянство — это ключ к успеху. Вы узнаете намного больше, практикуясь час в день, чем тратя семь часов на написание кода по субботам.
Люди — существа привычки, так что сделайте кодинг частью вашего ежедневного распорядка.
Изучение кода похоже на попытку стать самым сильным человеком в мире
Вы когда-нибудь смотрели передачу «Самый сильный человек в мире»? Обучение коду очень похоже на номер с грузовиком. Сначала это сложно. Это кажется невыполнимой задачей. Вы движетесь детскими шажками.
Если вам больше нравится учиться по видеоурокам, тогда ищите обучающую информацию на YouTube или иных ресурсах.
Но хочу предупредить вас. Не увлекайтесь покупкой большого количества платных курсов. В начале изучения веб-разработки нет необходимости тратить большие деньги на учебные ресурсы — на раннем этапе вы, вероятно, не будете уверены на 100%, что именно вы хотите изучать.
Одна из прекрасных особенностей сообществ веб-разработки любых направлений — это то, что они не дискриминируют участников в зависимости от их знаний. Для входа туда не существует барьеров. Большинство опытных членов сообщества будут готовы потратить своë время и помочь вам — пользуйтесь этим.
Как самостоятельно изучить веб-программирование
Автор: Сергей Никонов
Если вы очень хотите самостоятельно изучить веб-программирование и не знаете с чего начать и в какой последовательности изучать создание веб-сайтов, в данной статье вы найдете 6 простых шагов для освоения этой не простой, но очень интересной и высокооплачиваемой профессии веб-программист.
Почему так важен план обучения
Многие люди, желающие изучать веб-программирование, совершают одну и ту же ошибку. Рассмотрим типичный пример.
Человек для себя твердо решил, что хочет сменить свою текущую профессию и окунуться в увлекательный мир программирования, тем более, что обладателям данной профессии платят достаточно высокую заработную плату.
И вот новичок делает запрос в гугл “Курсы программирования” и перед ним открывается несколько десятков тысяч результатов с курсами.
Курсов программирования по созданию сайтов существует огромное количество: Курсы PHP, курсы HTML и CSS, курсы по Javascript, курсы по Yii2, курсы по MySQL и многие другие.
И новичок, желая постигнуть все курсы, бросается делать новые запросы в гугл:
Скачать бесплатно курсы программирования на торрентах, бесплатно курс по PHP и другие запросы. И в итоге собирает у себя на жестком диске, несколько терабайт курсов по программированию и несколько десятков мегабайт книг по созданию веб-сайтов.
Начинает смотреть сначала один курс по программированию, не досмотрев первый, когда перестает получаться, переключается на другой курс программирования или на другую технологию. И так, прыгая от курса к курсу, в голове у новичка в программировании образуется “каша” в голове.
Кто-то не зная основ объектно-ориентированного программирования, сразу скачивает курсы по Паттернам проектирования или не зная основы Javascript, пытается изучать курсы по Angular JS.
Именно по этой причине так важен план обучения. Не совершайте похожие ошибки и вы пойдете кратчайшим путем к новой востребованной профессии веб-программист.
Шесть шагов как стать веб-программистом
Итак, если вы всерьез решили самостоятельно научиться программировать, выполните всего шесть шагов.
Шаг первый. Научитесь верстать.
Начните с верстки сайтов. За верстку сайтов отвечает технология HTML и для придания красивого внешнего вида каскадная таблица стилей или по другому ее называют CSS.
С помощью этой технологии, вы научитесь из обычной картинки формата JPEG или PSD макета Photoshop программировать внешний вид сайта, чтобы верстка сайта корректно открывалась в браузере.
Верстка сайта — это процесс создания визуальной части сайта, без функциональной составляющей сайта. Сверстанную страницу можно будет открыть в браузере, она будет выглядеть как сайт, но если вы нажмете например на кнопку, то ничего не произойдет.
Обязательно нужно тренироваться. С помощью HTML и CSS попробуйте создать 10 — 20 страниц вашего будущего веб-сайта.
Найдите сайт в интернете, но не слишком сложный, который вам понравится и попробуйте создать похожий. Сначала у вас не будет получаться, но этот этап пройдет, если вы будете пробовать снова и снова.
Вы можете скачать курс по технологиям HTML и CSS в интернете или вы можете посмотреть наш курс бесплатно онлайн в личном кабинете
Шаг второй. Фреймворк Bootstrap.
Пускай вас не пугает страшное слово фреймворк. Вскоре вы поймете, что это ваш самый близкий друг, который будет выручать вас при создании многих сайтов.
Изучайте Bootstrap только после того, как в полной мере освоили предыдущий шаг HTML и CSS.
С помощью фреймворка Bootstrap вы сможете создавать ту же самую верстку сайта, но намного быстрее. И одно из самых важных преимуществ Bootstrap, в том, что верстка ваших сайтов, будет адаптивной.
То есть ваш сайт будет хорошо выглядеть как на больших мониторах, так и на смартфонах и планшетах. Верстка сайта будет автоматически подстраиваться под устройство и вам для этого практически ничего не нужно будет делать, за вас позаботится Bootstrap.
Официальную документацию для самостоятельного изучения Bootstrap вы можете найти по адресу http://getbootstrap.com/ или можете смотреть наш курс по данному фреймворку в FructCode.
На фреймворке Bootstrap пробуйте также создавать верстку сайтов, чтобы немного освоиться.
Шаг третий. Программирование.
После того, как вы поймете основы верстки и создадите несколько своих сайтов-прототипов, переходите к программированию. Можете начать с языка PHP. Он невероятно простой и понятный.
Простота языка программирования с одной стороны хорошо, что на нем можно очень быстро научиться создавать скрипты на PHP, но с другой стороны плохо, что если вы упустите теоретическую часть, ваш код будет очень сложным для понимания, а программы написанные на нем, ограничены.
Изучение PHP начните с процедурного процедурного подхода в программировании. Изучите основные понятия любого высокоуровневого языка программирования: Переменные, Типы переменных, Массивы, Циклы, Функции и другое. Именно в такой последовательности.
Напишите с помощью процедурного подхода несколько простых программ, например, калькулятор или светофор.
Когда разберетесь более-менее с процедурным программированием на PHP, изучайте Объектно-ориентированное программирование (ООП).
ООП очень популярная парадигма программирования. Ее используют как минимум 90% всех софтверных компаний по всему миру, начиная от разработки простых сайтов, заканчивая разработкой огромных социальных сетей, например Facebook или VK и даже игр.
Системы написанные с помощью объектно-ориентированного программирования можно масштабировать и расширять до гигантских систем.
Когда изучите основы ООП на языке PHP, перепишите созданные ваши скрипты на процедурном подходе к программированию, в объектно-ориентированном стиле.
Шаг четвертый. База данных MySQL и CRUD.
Когда изучите предыдущие шаги, переходите к изучению взаимодействия языка программирования PHP с базой данных, с помощью языка запросов SQL.
Дело в том, что большая часть информации и даже текст который вы сейчас читаете, хранится не статично в HTML странице, а в таблице базы данных. Эта технология позволяет эффективно хранить и обрабатывать информацию.
Основы по языку запросов и администрированию MYSQL вы можете прочитать здесь
На этом шаге вам нужно будет попробовать создать CRUD приложение, которое сможет, к примеру, создавать на сайте новости, удалять на сайте новости, обновлять на сайте новости и просматривать новости.
Когда вы напишите несколько CRUD приложений, можно двигаться дальше к пятому и самому интересному шагу.
Полный и интерактивный курс по PHP и MySQL вы можете пройти здесь
Шаг пятый. MVC фреймворк.
Благодаря этому паттерну, вы сможете создавать удобную структуру кода вашего веб-приложения и сможете, имея правильную структуру, быстро дописывать новый функционал для вашего сайта.
Создайте на простом PHP фреймворке и на паттерне MVC, сначала CRUD приложение, а затем и ваш первый веб-сайт.
Курс по фреймворку CodeIgniter доступен на сайте FructCode
Шаг шестой. Изучение других технологий.
После того, как вы получили начальный опыт в программировании и возможно стали уже получать первые деньги за создание веб-сайтов, изучайте Composer, GIT, основы Linux, Javascript.
Затем переходите к более сложные фреймворки, такие как Yii2 или Laravel.
Не стоит сразу начинать с данных фреймворков или более сложных фреймворков на предыдущих шагах, не создавайте себе сложности.
И не пытайтесь пройти все шаги за месяц. Это невозможно. Информация должна усваиваться естественным образом.
По всем технологиям вы можете гуглить, например: Что такое MVC php.
Заключение
Если вы будете следовать простым шагам, вы научитесь создавать профессиональные веб-сайты самостоятельно и получите шанс обрести новую высокооплачиваемую профессию, востребованную во всем мире.
Наоборот, в такие моменты вам нужно взять себя в руки и преодолеть эти трудности! Но одному постоянно мотивировать себя учиться достаточно тяжело.
И здесь вам поможет наставник.
Записывайтесь на наш пятимесячный курс Профессия веб-программист и вы сможете пройти все вышеперечисленные шаги вместе с опытным преподавателем.
Вы разберетесь в терминологиях ООП, такие как объекты, классы, инкапсуляция, полиморфизм, создадите профессиональный веб-сайт КИНОМОНСТЕР и в момент, когда вы захотите все бросить, получите “волшебный мотивационный пинок” 🙂
И если вы будете выполнять все домашние задания и проходить тестирования, результат вас точно не разочарует!
Для того, чтобы посмотреть видео, зарегистрируйтесь в личном кабинете
От студента до учителя: как разобраться в веб-разработке, если это не твой профиль
Хоть кому-то и может показаться, что веб-разработчик — это суровый технарь (айтишник же!), вход в эту профессию не сложнее, чем в Python . В неё часто переходят бывшие педагоги, юристы, бухгалтеры и другие гуманитарии. О том, с чего начать обучение, какие ошибки допускают новички, как освоиться в профессии и стоит ли самостоятельно учиться, рассказывает преподаватель веб-разработки в GeekBrains Алексей Кадочников.
Веб-разработчиком может стать любой — главное не бояться компьютера и иметь желание попробовать себя в профессии. Эта профессия на входе не требует глубоких технических знаний: математика или алгоритмы — это скорее бонус, чем необходимость. Я не заметил кардинальной разницы между тем как обучаются технари и гуманитарии, просто у первых на старте чуть больше знаний. Но эта разница уходит в считанные дни, главное — перебороть лень и заняться делом.
Чтобы освоить профессию, важно заниматься каждый день хотя бы один-два часа. Увы, это понимают не все, некоторым кажется: чтобы стать разработчиком, нужно просто прослушать пару лекций. Но это не так.
Никогда не откладывайте обучение на завтра: заведите будильник, например, на восемь вечера. Большинство людей к этому времени успевают освободиться от работы, попасть домой и даже поужинать. Зазвенит — садитесь и занимайтесь до девяти-десяти. И так каждый день. Пропустили? Добавьте пропущенный час к занятию завтра.
Конечно же, 8 вечера — это не панацея. Главное — оптимизировать график, чтобы эффективно совмещать обучение и работу. Когда я переучивался на разработчика (об этом расскажу дальше), ставил будильник на шесть утра, занимался, завтракал и ехал на работу.
Кто переучивается на разработчика
Сменить профессию на разработчика чаще всего решаются люди около 30 лет — они уже отучились в вузе, поработали в своей сфере, но им не понравилось. Причин сменить специальность может быть много — низкие зарплаты, неинтересные задачи, отсутствие возможностей для развития. Человек может просто захотеть заняться чем-то иным, более прибыльным и комфортным. Среди моих студентов есть юристы, строители, врачи, экономисты, учителя, инженеры и многие другие.
Взрослым учиться легче, чем детям: им не занимать мотивации, они максимально осознанно приходят к обучению, а задачи порой выполняют быстрее, чем уже состоявшиеся специалисты на работе.
Мне самому пришлось сменить специальность. Восемь лет назад, когда я окончил университет, оказалось, что на рынке по специальности «Вычислительные машины, комплексы, системы и сети» всего 8 вакансий. Для четырех из них мне не хватало опыта, а по ещё четырём мне не перезвонили. В результате устроился инженером на завод и через несколько месяцев работы понял, что это не то, чему я хочу посвятить жизнь. Тогда я с нуля прошел курсы веб-разработки и нашёл работу по их окончанию. Сейчас я Front-end developer вMail.ru Group и преподаю в GeekBrains.
Еще один пример — мой студент Павел Литвин. Он не доучился в ВУЗе на безопасника, работал менеджером по продажам, потом в SEO, в конце концов выучился фронтенд-разработке и стал зарабатывать в 4 раза больше, чем до курсов. И таких историй — множество.
Представление о профессии у новичков зачастую далеко от реальности. Некоторым всё ещё кажется, что программист — это тот, кто сидит дома, ничего не делает и много зарабатывает. Когда сталкиваюсь с таким у студентов, приходится объяснять, чем именно нужно будет заниматься, сколько времени учиться и как потом предстоит работать.
Чтобы понять, подойдет ли тебе специальность, надо просто попробовать. В онлайн-школах, где учат разработке, есть бесплатные интенсивы на несколько часов. За это время студентам предлагается сделать небольшой проект: так можно понять, подходит ли им эта сфера. Если вы попробовали пару таких интенсивов и ничего не получается или не нравится процесс, возможно, это не ваше призвание и стоит продолжить поиски. Профессия веб-разработчика подходит многим, но это не универсальный рецепт. Наверняка вы найдете для себя что-то другое.
Кроме интенсивов, есть вводные вебинары о том, чего ждать от специальности, насколько она востребована, какие в ней зарплаты, что нужно делать на работе. Подобными видео и текстами пестрит интернет, найти их — легко. Посмотрите, чтобы понять, чем вы будете заниматься, если вы выберите этот путь.
Самостоятельное обучение
В принципе можно попытаться освоить профессию самому — материала в сети достаточно. Но рано или поздно наступает момент, когда код не работает, программа не запускается и непонятно, что делать дальше. Ты упираешься в тупик и не можешь из него выйти, потому что некому подсказать. Преподаватель помогает избежать этой проблемы. Он расскажет про наиболее эффективные технологии и решения, поделится опытом — это большой плюс при трудоустройстве. Благодаря таким советам один и тот же проект можно выполнять в два раза быстрее.
В момент, когда я пошёл на курсы, мой знакомый решил учиться самостоятельно — три года что-то читал, смотрел в интернете. В итоге за это время он вышел на зарплату в 50 000 рублей. Пойди он на курсы, достиг бы этого результата уже через полгода-год. Думая, что экономит, он потерял деньги.
Еще одна частая проблема самостоятельного обучения веб-разработке с нуля — освоение устаревших технологий. Мне приходилось переучивать студентов, выучивших неактуальную информацию. Есть вещи, которые уже не применяются, оптимизировались и их нужно удалить из памяти или перенастроить. Например, раньше в верстке для перемещения элемента использовалась команда float left, но это довольно громоздкое и сложное решение. Затем вместо него начали использовать display: flex. Теперь и этот метод успел устареть и теперь актуален display: grid. Внешний вид от всех этих способов будет одинаковым, но последнее решение изящнее и быстрее в реализации.
Наверное, самое большое заблуждение при самостоятельном освоении профессии — отсутствие представления о том, как технологии связаны друг с другом и могут работать в связке. Без учебной программы все знания получаются хаотичными. Также велика вероятность, что после самообучения у вас не будет портфолио (на курсах оно будет) и четкого понимания путей развития в профессии (чтобы его выработать, нужно общаться с теми, кто в этом разбирается).
Всем, кто учится разработке, рекомендую смотреть обзорные вебинары и интенсивы, где рассказывают, как один проект собирает несколько технологий воедино. Польза тут не столько в самих технологиях, сколько в создании целостной картины о том, как и что работает вместе.
Наслушавшись теории, часто не представляешь, как ее использовать. Чтобы осваивать разработку, можно заниматься в онлайн-тренажерах вроде этого. Такие штуки предлагают минимум теории и максимум прикладного применения.
Чтобы сохранить мотивацию, когда я делаю что-то новое, использую такой приём: записываю видео, в котором озвучиваю цели и мотивы текущих задач. Если через условные три месяца наступает момент, когда опускаются руки, просматриваю его. Если идея с видео вам не нравится, попробуйте написать вдохновляющее письмо.
Высшее образование и курсы
Я устраивался на работу много раз, переезжал между городами и даже странами СНГ. За всё время про диплом о высшем образовании у меня спросили всего дважды. Поэтому я бы не сказал, что это дает какое-то преимущество перед другими соискателями. На собеседованиях проверяют технические знания. Если их нет, никакой диплом не спасет.
На курсы обычно приходят люди, которые хотят после них устроиться по специальности. Поэтому и знания там обычно дают профильные, нужные для работы. В этом их отличие от университетов, где часть изученного потом некуда применить. В Geekbrains, где я обучался профессии веб-разработчика и теперь преподаю, изучают только технологии, необходимые для работы. Когда мы только создавали курс, провели опрос веб-разработчиков школы, узнали у них, что актуально, а что нет, какие технологии важно включить в программу, а без каких можно обойтись.
Чтобы учиться на курсах эффективно, нужно смотреть вебинары, выполнять практические задания и (как минимум) читать первые ссылки в Google или Яндекс по теме урока: это помогает немного расширить понимание пройденного.
Читать учебники перед началом обучения не стоит: они очень быстро устаревают. С момента написания книги до её попадания на полки проходит не один месяц. Её нужно отредактировать, сверстать, напечатать, выпустить на рынок. Лучше перед учебой (или одновременно с ней) читать официальную документацию выбранного языка или технологии. Например, вот сайт, на котором собран максимум информации для старта в JavaScript.
У нас на курсах есть задания для командной работы с несколькими разработчиками. Мы стараемся сделать программу максимально адаптивной. Каждый, кто прошел курс, может написать о нём и своём преподавателеотзыв. То, что присылают выпускники, не модерируется и всегда рассматривается отделом качества. Если его специалисты видят проблемы по какому-то предмету, они отправляют заявку, чтобы курс обновили.
Вариантов обучения много — можно выучиться на джуна, а можно сразу на миддла. Можно быть фронтендером, бекэндером или освоить обе технологии, став фулстек-специалистом. Разница — в освоенных технологиях:
Junior-frontend должен знать html + css + js + react.
Junior-fullstack: html + css + js + php + базы данных.
Middle frontend разработчик: html + css + js + react + vue + node.js + командная разработка.
Middle-fullstack: html + css + js + react + php + laravel + базы данных + командная разработка.
Обучение веб-разработке на наших курсах длится от 5 месяцев. За это время можно получить базу junior-фронтенда. Чтобы изучить технологии, нужные для миддл-фронтенда, понадобится год. Освоение навыков миддла и для фронтенда, и для бэкенда требует 1,5 года. А дальше нужно идти в бой и набираться опыта, чтобы подтвердить этот статус в реальной работе.
Я преподаю фронтенд-разработку. Особенность курса — в постоянной демонстрации практической составляющей, в каждом уроке показываю, как применять изученное. Мы даём прикладные знания, а все домашние задания связаны друг с другом. С 1 по 8 урок студенты постепенно разрабатывают готовый проект, и в итоге они успевают сделать пятистраничный проект интернет-магазина. Например, вот такого:
Как устроиться на работу и что от нее ожидать
Для работы необходимы общие знания по веб-разработке. Даже если вы учились фронтенду, на собеседовании придётся показать, что владеешь и бекендом. Например, спрашивают про PHP, а если ты его не знаешь, уточняют, готов ли подучить.
Целостные знания, полученные на курсах, дают возможность быстро выучить новое. Если ты уже умеешь делать что-то на одном языке, то сделаешь и на другом. Это все равно что учиться водить: не важно, на какой машине вы начинали ездить — пересев на другую, вы все равно быстро адаптируетесь и поедете.
Джуну на первой работе можно рассчитывать на 40–60 тысяч, миддл зарабатывает от 100–150 тысяч. По сути, зарплата может быть и 200–250 тысяч, но чтобы знаний хватило на зарплату миддла, нужно прилежно учиться не меньше полугода-года.
С общими знаниями и пониманием основных технологий найти первую работу будет несложно — нужны упорство, труд и уверенность в себе. Рынок голодный, но не спешите с выбором. Пройдите с десяток собеседований: так вы поймете, что есть на рынке, и остановитесь на том, что подходит вам.
Самая частая ошибка на собеседованиях — говорить лишнее. В разработке на болтовне не выедешь: отвечать нужно уверенно и по сути. Если где-то не уверен или не знаешь, стоит показать логику действий в такой ситуации, но ничего не выдумывать и не заговаривать интервьюера. Веб-разработка — это работа в команде. Поэтому важно показать, что ты умеешь работать с другими и есть релевантный опыт. У нас на курсах есть задания для командной работы с несколькими разработчиками.
На собеседованиях вам скорее всего зададут вопросы про базу JavaScript, консоли. Обязательно дадут тестовые задания — например, страницу, с которой что-то нужно сделать. Спросят связку нескольких технологий, чтобы понять, есть ли у вас целостное понимание.
Не страшно, если вдруг собеседование провалится — поищите дома ответы на вопросы, порешайте задачи, погуглите типичные задания по вашей специальности и идите на следующую встречу.
Нужно помнить, что на работе (зачастую) никто никого ничему учить не будет. Разработчику дают конкретную задачу и просят её сделать. Я думаю, что если есть желание быстро развиваться в профессии, лучше выбирать место, где много сотрудников и есть старший наставник. Работая в одиночку развиться очень сложно.