Самый быстрый и экономичный способ обучения, а также бесплатные и платные курсы.
Любой может научиться программировать, но какие языки программирования должны изучать абсолютные новички в первую очередь? Есть так много вариантов! Если вы страдаете параличом принятия решений, я призываю вас прекратить исследования и вместо этого использовать время, чтобы узнать что-то, что поможет вам быстро начать работу.
Ниже приводится дорожная карта, которая поможет вам окунуться в мир программирования наиболее простым, быстрым и экономичным способом. Я не дам вам выбора. Я покажу вам точные курсы, которые нужно пройти, чтобы вам больше не приходилось искать.
Языки в этой дорожной карте будут существовать долгое время. Даже если вы позже передумаете, они дадут вам прочную основу. Вы не пожалеете, что узнали их.
Прежде чем перейти к дорожной карте, важно знать, в какой части огромного мира разработки вы будете работать, и почему я рекомендую эту дорожную карту. Поэтому в следующем разделе дано краткое описание ветвей разработки программного обеспечения.
Отрасли разработки программного обеспечения
Следующие направления разработки программного обеспечения по Википедии:
- Программная инженерия
- "Компьютерное программирование"
- Разработка видеоигр
- Веб-разработка * ( рекомендую)
- Разработка веб-приложений
- Разработка мобильных приложений
Если вы точно не знаете, что хотите начать с какой-либо из других ветвей, то я рекомендую вам начать с веб-разработки. .
Почему веб-разработка? По следующим причинам:
- Веб-разработчики создают все, что вы видите на веб-сайтах по всему миру, и их навыки очень востребованы. По данным U.S. Новости веб-разработчики занимают 3-е место в рейтинге Лучшие рабочие места в сфере технологий и 23-е место в рейтинге Все вакансии. Средняя зарплата веб-разработчика в 2018 году составляла 69 430 долларов, а 25% самых высокооплачиваемых сотрудников - 95 020 долларов. Согласно CollegeGrad.com, ожидается, что занятость веб-разработчиков вырастет на 8 процентов в течение следующих десяти лет [2019–2029], что намного быстрее, чем в среднем по всем профессиям.
- Основные языки веб-разработки (HTML, CSS и Javascript) считаются одними из самых простых для изучения. Некоторые утверждают, что HTML и CSS не являются языками программирования, но называйте их как хотите, без них невозможно создать веб-сайт - это языки программирования. Фактически, вы можете получить работу, зная только HTML и CSS.
- С помощью веб-разработки вы можете научиться программировать в свободное время и можете практиковать свое новое ремесло, создавая свои собственные веб-сайты или веб-сайты для клиентов. Дело в том, что барьер на практике изученного для веб-разработчиков ниже, чем для других ветвей разработки программного обеспечения. Например, клиента, который наймет вас для создания веб-сайта, найти легче, чем того, кто хочет, чтобы вы сделали видеоигру.
- Простой ноутбук - это все, что нужно для занятий своим ремеслом. Другие отрасли разработки, такие как разработка видеоигр, требуют более дорогих компьютеров более высокого уровня.
Есть несколько вещей, которые вам нужно иметь, прежде чем вы сможете начать обучение программированию, следуя дорожной карте. Я кратко изложу их в следующем разделе.
Все, что вам нужно, и то, что вам нужно знать
Вот то, без чего вы не можете обойтись:
Ноутбук / настольный компьютер
Вы можете следовать видео и текстовым инструкциям на своем мобильном телефоне, но когда вы хотите начать практиковать то, что вы узнали, вам понадобится ноутбук или настольный компьютер. Ноутбук лучше, потому что он портативный. Получите лучшее, что вы можете себе позволить. Не нужно ничего особенного. Ноутбук за 150 долларов справится с этой задачей. Для веб-разработки не требуются высокопроизводительные видеокарты или процессоры.
Операционная система тоже не имеет значения. Windows 10, Mac, Linux и Chrome OS подойдут.
Некоторые данные для загрузки руководств
Это может показаться очевидным, но для этого нужно выделить бюджет. Если вы посмотрите много видеоуроков, вам понадобится от 1 до 10 ГБ данных. Письменные учебные пособия гораздо менее требовательны к данным, но вы обнаружите, что вначале вы будете смотреть больше видео, потому что им намного легче следовать.
Редактор кода
Редактор кода - это программа, похожая на Microsoft Word, которую вы используете для написания кода. Выбор правильного редактора кода имеет огромное значение в том, насколько легко писать код. Пока вы все еще учитесь, полезно использовать тот же редактор, что и в учебнике, которому вы следуете, потому что тогда вы можете следовать по щелчку за щелчком.
Самый популярный редактор - Visual Studio Code. Этот редактор является бесплатным, поддерживается Microsoft и используется большинством профессиональных разработчиков. Я очень рекомендую этот редактор. Вы обнаружите, что его используют большинство онлайн-преподавателей.
Вот несколько руководств по YouTube, чтобы вы могли начать работу:
Начало работы с Visual Studio Code (5:03) Краткое введение (YouTube)
Учебное пособие по Visual Studio Code для начинающих - Введение (33 : 48) Подробное руководство (YouTube)
Ускоренный курс Visual Studio Code (1:32:34) Подробное руководство (YouTube)
Браузер со специальными инструментами для разработчиков
Веб-разработка - это создание веб-сайтов, и вам нужен браузер, в котором есть специальные инструменты для разработчиков, чтобы они могли работать на своем веб-сайте.
Рекомендую Хром. Да, тот самый Chrome, который вы используете для работы в Интернете! В Chrome есть скрытые инструменты разработчика, которые можно включать и выключать, нажимая F12. Попытайся!
Этому руководству уже 3 года, и некоторые кнопки и значки Chrome могли быть перемещены, но это хорошее место для начала и даст вам хорошее вступление для начинающих:
Ускоренный курс по инструментам разработчика Google Chrome (51:19) Подробное руководство (YouTube)
Вам необходимо знать следующее:
Фронтенд и бэкэнд
Все, что вы видите при посещении веб-сайта, - это интерфейс.
Когда вы входите на веб-сайт со своим паролем, код на удаленном сервере, который проверяет ваши данные, является внутренним. Когда вы входите в свой банковский счет и переводите деньги, код на сервере, который выполняет перевод, является внутренним кодом.
База данных и хранилище
«База данных» - это термин, используемый для места на сервере, где хранится информация структурированного текста, например, ваше имя, адрес и т. Д. Пример: {name: Mark, address: 100 Main Улица.}
«Хранилище» - это термин, используемый для места на сервере, где хранятся файлы, такие как JPG, PDF и другие документы.
Каркасы
Некоторые языки, такие как CSS и Javascript, имеют фреймворки. Смысл этих фреймворков состоит в том, чтобы объединять вещи в небольшие повторно используемые части, чтобы пользователю не приходилось делать что-то вручную. Хорошим примером CSS-фреймворка является Bootstrap, который объединяет такие вещи, как стили кнопок.
См. Это видео на YouTube для получения дополнительной информации.
Плюсы и минусы Web Development Framework (20:21)
Одностраничное приложение (SPA) против многостраничного приложения (MPA)
MPA - это традиционный способ работы веб-сайтов. Каждый раз, когда вы нажимаете на ссылку, с сервера загружается новая страница.
С другой стороны, SPA загружают базу кода, которая позволяет вам перемещаться по веб-странице, как если бы это было приложение. SPA должны быть быстрее, и во время взаимодействия с пользователем из базы данных извлекаются только структурированные текстовые данные. Фреймворки Javascript используются для создания SPA.
Смотрите эти видео на YouTube для получения дополнительной информации:
Динамические сайты против статических страниц против одностраничных приложений (SPA) (12:11)
SPA против MPA / MVC - всегда ли одностраничные приложения лучше? (15:59)
Бесплатные и платные курсы
Не дайте себя обмануть, говоря, что вам нужно посещать дорогие модные курсы, чтобы научиться программировать. Примерно 80% всего, что вы узнаете, будет из бесплатных источников. YouTube, вероятно, лучший ресурс, и их гораздо больше, в том числе множество письменных статей в Интернете.
Вы также обнаружите, что по мере того, как вы набираетесь опыта, вы сможете читать документацию по программированию прямо из исходного кода без какого-либо наставничества.
Всегда начинайте с бесплатных ускоренных курсов, а затем, если вы хотите копнуть глубже, найдите платный курс или используйте тот, который рекомендован в этой статье.
1. HTML (HTML5)
Уровень сложности: 1/10
Использовать: интерфейс
О программе
HTML - это аббревиатура от языка гипертекстовой разметки. Не пугайтесь длинного имени, этот язык - милый котенок.
Почему именно HTML?
Потому что без него невозможно создать веб-страницу. Эта страница, которую вы читаете, отображается с использованием HTML. HTML сообщает браузеру, что и где отображать такие вещи, как текст, изображения, формы и кнопки.
Курсы
Если вы хотите погрузиться глубже (рекомендуется), следуйте мини-серии из четырех частей YouTube ниже:
Курс HTML - Как работает Интернет | Учебник для начинающих | №1 (23:34)
Курс HTML - Как работают веб-разработчики | Учебник для начинающих | # 2 (9:39)
Курс HTML - Погружение в HTML | Учебник для начинающих | # 3 (27:49)
Курс HTML - Углубляемся в HTML | Учебник для начинающих | # 4 (46:49)
Если вы хотите сразу погрузиться в HTML, начните с этого мини-курса YouTube:
Ускоренный курс HTML для абсолютных новичков (1:00:41)
Как долго вы сможете достичь профессионального уровня
Около 30 часов уроков + практика
2. CSS
Уровень сложности: 3/10
Использовать: интерфейс
О
CSS - это аббревиатура от каскадных таблиц стилей. Задача CSS - сделать HTML красивым. HTML и CSS работают вместе, как машина и краска.
Почему именно CSS?
Вы можете оставить HTML без какого-либо стиля CSS, но это будет плохо выглядеть.
Курсы
Это хороший вводный курс:
Ускоренный курс CSS для абсолютных новичков (1:25:11) Мини-курс YouTube
Если вы действительно хотите погрузиться глубоко, пройдите этот платный курс на Udemy примерно за 12 долларов США (ждите специальных предложений, которые предлагаются каждые пару недель). У вас будет пожизненный доступ к курсу:
CSS - Полное руководство 2020 (включая Flexbox, Grid и Sass) (22,5 часа)
Сколько времени нужно, чтобы стать профессиональным
Около 60 часов уроков + практика
Фреймворки CSS
Фреймворки CSS объединяют готовые стили, поэтому вам не нужно начинать с нуля. Они очень просты в использовании. Я рекомендую начать работу с Bootstrap.
Вот несколько курсов Bootstrap:
Ускоренный курс Bootstrap для начинающих (1:13:27) Мини-курс YouTube
Учебник по Bootstrap 5 - ускоренный курс для начинающих (1:25:45) YouTube mini -курс
3. Javascript
Уровень сложности: 6/10
Использовать: интерфейс и серверная часть
О
Javascript - это язык, который выполняет всю тяжелую работу на веб-сайте. Javascript используется каждый раз, когда вы отправляете форму, входите в систему или получаете какие-либо данные с сервера. Он также создает специальные эффекты, такие как перемещение объектов на веб-странице.
В Javascript есть несколько причуд, например ключевое слово this. Не беспокойтесь об этом сейчас, но вы скоро с ними столкнетесь.
Почему именно Javascript?
Без Javascript сложно создать веб-сайт. У вас может быть страница для показа без нее, но никакое взаимодействие невозможно.
Курсы
Ускоренный курс JavaScript для начинающих (1:40:29) Мини-курс YouTube
Если вы действительно хотите выплеснуться, пройдите этот платный курс по Udemy примерно за 12 долларов США.
JavaScript - Полное руководство 2020 (Начальный + Продвинутый) (52 часа)
Как долго вы сможете достичь профессионального уровня
Около 120 часов уроков + практика
Фреймворки Javascript
См. ниже.
4. Фреймворки Javascript
Уровень сложности: 8/10
Использовать: интерфейс
О
Я поместил фреймворки Javascript в отдельный раздел, потому что они являются основной темой. Вам не нужно изучать фреймворк, если вы просто хотите создать обычный веб-сайт. Их гораздо сложнее использовать, чем просто HTML + CSS + Javascript. Они объединяют HTML + CSS + Javascript в структуру, которая упрощает создание веб-приложений.
Если вы хотите тратить деньги только в случае крайней необходимости, тогда вам следует потратить свои деньги на курсы фреймворка Javascript.
Почему именно Javascript Framework?
Javascript Framework позволяют создавать на вашем веб-сайте быстрое приложение, подобное SPA.
Вот два фреймворка Javascript, которые вы можете попробовать:
а) Угловой (+ Машинопись)
Angular - это огромный фреймворк, который предоставит все необходимое для создания вашего SPA.
Вы должны использовать Typescript с Angular вместо Javascript. Не волнуйтесь, они почти такие же, вы очень быстро освоите Typescript.
Вот несколько курсов, которые вы можете пройти. Возможно, вам придется пройти платный курс, если вы хотите стать профессионалом на 100%. Но начните с бесплатных ускоренных курсов, чтобы понять, о чем идет речь.
Курсы
Ускоренный курс Angular (1:24:09) YouTube, ускоренный курс
Ускоренный курс TypeScript (46:09) YouTube, ускоренный курс
Вы можете потратиться на платный курс Udemy (ждите специальных предложений):
Angular - Полное руководство (издание 2020 г.) (33,5 часа)
Понимание TypeScript - издание 2020 г. (15 часов)
Как долго вы сможете достичь профессионального уровня
Около 120 часов уроков + практика
б) Реагировать
Еще один огромный фреймворк.
Курсы
Ускоренный курс React JS (1:38:23) YouTube, ускоренный курс
Я также рекомендую этот платный курс по Udemy:
React - Полное руководство (включая хуки, React Router, Redux) (40,5 часов)
Как долго вы сможете достичь профессионального уровня
Около 120 часов уроков + практика
Angular против React
Какой из них вы должны изучить? В последнее время React стал более популярным. Но оба являются хорошими фреймворками. Я предпочитаю Angular.
Angular старше, поэтому имеет больше учебных ресурсов и поддерживается Google.
Пройдите бесплатные ускоренные курсы для каждого и посмотрите, какой из них вам больше нравится.
Angular vs React vs Vue [Обновление 2020] (28:08) YouTube
5. Git и GitHub
Уровень сложности: 1/10
Использовать: интерфейс
О
Как только вы начнете кодировать, вам нужно будет где-нибудь сохранить файлы проекта. Git позволяет сохранять все версии ваших файлов в удобном для отслеживания формате. Это система контроля версий. Без него не работает ни один профессиональный разработчик.
Каждый раз, когда вы «фиксируете» в своем репозитории Git, Git будет записывать, кто внес изменения, когда они были внесены и какие файлы были изменены. Git позволяет нескольким разработчикам одновременно работать над одним проектом. Вы можете вернуться к более ранней версии своего проекта в любое время.
GitHub - это просто копия вашего репозитория Git в облаке, синхронизированная с вашим локальным репозиторием Git.
Git встроен в код Visual Studio, и это еще одна причина, по которой я рекомендую этот редактор.
Почему Git?
Если у вас сверхчеловеческая память, не используйте Git. Если вы уверены, что ваш ноутбук не сломается или не украдут, или вам не нужно сотрудничать с другими разработчиками, не используйте GitHub.
Курсы
Ускоренный курс Git и GitHub для начинающих (32:42) YouTube, ускоренный курс
Учебник по Git для начинающих - основы (47:07) YouTube , ускоренный курс
Учебник по Git для начинающих - ускоренный курс (29:38) YouTube, ускоренный курс
Учебник GitHub для начинающих | Основы (19:03) YouTube, ускоренный курс
Как долго вы сможете достичь профессионального уровня
Около 20 часов уроков + практика
6. Хостинг + База данных + Хранилище + Аутентификация
Уровень сложности: 5 из 10 (при использовании Firebase, как описано ниже)
Использовать: серверная часть
О
После того, как вы создадите свой веб-сайт, вам потребуется где-нибудь в Интернете для его размещения. В Интернете есть много хостинговых услуг, но я собираюсь порекомендовать Firebase, Google Backend-as-a-Service - BaaS, где вы можете размещать свои проекты.
Почему именно Firebase?
Firebase может управлять всеми вашими внутренними требованиями, такими как хостинг, база данных, хранилище, аутентификация и аналитика, а также многие другие службы. Преимущество всех этих сервисов заключается в том, что новичкам легко предоставить серверную часть для своего веб-сайта, не создавая все вручную.
Для сервисов Firebase существует щедрый уровень бесплатного пользования, который вы можете использовать для своих начинающих проектов. Скорее всего, вы не будете ничего платить, пока у вас не будет нескольких тысяч пользователей.
Комбинация Angular + Firebase особенно синергетична, потому что обе поддерживаются Google.
Курсы
Firebase - Назад к основам (25:22) YouTube, короткое введение в Firebase
Канал Google Firebase на YouTube Смотрите все Firebase на Интернет видео
Сколько времени нужно, чтобы стать профессиональным
Около 100 часов уроков + практика
7. Библиотека RxJS (реактивные расширения для JavaScript)
Уровень сложности: 9 из 10
Использовать: Backend + Frontend и свяжите интерфейс с серверной частью.
О
RxJS - это библиотека Javascript. Библиотека Javascript - это просто набор функций, которые вы можете добавить в свой код и использовать. Это сделано для того, чтобы вам не приходилось писать повторяющийся код с нуля. Например, общая функция - найти наименьшее число в массиве чисел.
Я поставил это под номером 7, но, по всей вероятности, вам придется изучить его, когда вы начнете использовать фреймворк Javascript или подключите свой интерфейс к Firebase.
RxJS использует наблюдаемые объекты для отслеживания изменений в базе данных или для отслеживания изменений любых других наблюдаемых объектов. Это чрезвычайно полезно, поскольку позволяет избежать необходимости постоянно проверять, есть ли какие-либо изменения в данных. При использовании RxJS любые изменения в базе данных удаленного сервера передаются в код внешнего интерфейса в течение миллисекунд без необходимости проверять вручную.
Почему именно RxJS?
Потому что это то, что используют профессионалы. Чрезвычайно полезная библиотека с огромным набором вариантов использования как в бэкэнде, так и во внешнем интерфейсе. Вам необходимо изучить RxJS, чтобы включить расширенные функции, такие как асинхронное программирование, в современные веб-сайты.
Курсы и ресурсы
Плейлист с хорошим знакомством с RxJS YouTube, плейлист
Десять лучших RxJS - кодируйте это, а не то (14:43) YouTube , краткое изложение
Быстрое начало работы с RxJS с практическими примерами (15:32) YouTube, краткое изложение
Изучение RxJS за 60 минут для начинающих - бесплатный ускоренный курс (59:49) YouTube
Сайты для RxJS:
LearnRxJS
Rxmarbles
Эти статьи полезны:
Научитесь комбинировать последовательности RxJ с суперинтуитивными интерактивными диаграммами
RxJS switchMap, concatMap, mergeMap, выхлопная карта (эта ссылка может не работать в будущем, так как сайт переносится )
Платные курсы Udemy:
Практика RxJs 6 (с БЕСПЛАТНОЙ электронной книгой) (4,5 часа)
Реактивный угловой курс (с RxJs) (5,5 часов)
Сколько времени нужно, чтобы стать профессиональным?
Около 100 часов уроков + много-много-много практики
Последние мысли
Процесс обучения может быть стрессовым для начинающих программистов. Выбор языковой карты не должен усугублять этот стресс. Многие новички сдаются, потому что в дорожной карте слишком много пробелов, и они не могут найти свой путь к месту назначения.
Не начинайте свое путешествие случайно в глуши. Если вы не уверены, с чего начать, я настоятельно рекомендую воспользоваться дорожной картой выше.
Спасибо за чтение и желаю вам всего наилучшего. Если вам понравилась эта статья, подумайте о подписке здесь на членство Medium, чтобы получить доступ к тысячам других статей.
Вам также может понравиться:
