ПОЛНОЕ РУКОВОДСТВО ДЛЯ ЭКСПЕРТНОГО ПРОГРАММИСТА

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

СОДЕРЖАНИЕ

  • Резюме
  • Гиды
  • Подготовьтесь к работе с 13 проектами, 2 курсами и 10 книгами
  • Руководство по готовности к работе - JavaScript Edition 2.0
  • Руководство по работе - Python Edition
  • Информатика и внутренняя разработка - Java Focus
  • Компьютерные науки и веб-разработка - комплексные
  • Веб-разработка с помощью основ компьютерных наук - комплексная
  • Data Science - комплексный
  • Программирование видеоигр - всеобъемлющие основы
  • Собственное программирование под Android - всестороннее
  • Руководства по конкретным темам
  • Регулярное выражение
  • Угловой
  • Vue
  • Реагировать
  • Списки практик / Speedrun Project - подготовка к собеседованию, создание портфолио, практика для соревнований по программированию
  • Атрибуция

Резюме

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

Гиды

Подготовьтесь к работе с 13 проектами, 2 курсами и 10 книгами

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

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

Вы прорабатываете учебную программу FreeCodeCamp и хотите быть готовыми к работе (для младшей должности), не пройдя все три сертификата? Хотите сократить процесс и сделать это быстро, не высмеивая во время интервью?

Вы думаете: «Я просто закончу сертификацию внешнего интерфейса» и начну подавать заявку?

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

Не бойтесь, что ЕСТЬ сертификация FCC, которая значительно приблизит вас к вашей цели. Объедините это с несколькими другими ресурсами, и вы сможете добраться туда. Бэкэнд-сертификация - это то, к чему вы хотите стремиться.

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

Прочтите эти книги, пройдите эти два курса, этот сертификат и эти три проекта.

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

Если у вас нет доступа к Netflix или вам просто нужна альтернатива Netflix Project

Clone Spotify - вы можете создать бесплатную учетную запись. Spotify

Вы можете использовать их API для поиска практически по всем имеющимся у них данным: Spotify Web API

На самом деле вы не можете загрузить полноформатные версии мультимедиа для воспроизведения в своем приложении, просто воспроизведите демонстрационный трек;)

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

  • Нет, это не так.
  • На самом деле это будет делать то, что не делает только интерфейсный сертификат. Он подготовит вас к работе веб-разработчика на современном рынке. Написание HTML и CSS - это еще не все, что нужно для работы. Это подготовит вас к отдыху
  • Не уходи.
  • Не паникуйте!

Руководство по готовности к работе - JavaScript Edition 2.0

Версия Job Ready Guide, ориентированная на JavaScript, узко ориентирована на развитие навыков, которые, вероятно, необходимы, чтобы быстро перейти к «готовому к работе» разработчику JavaScript. Это обновленная версия оригинального руководства Job Ready, которое включает в себя дополнительные практики алгоритмов, дополнительные проекты и последовательность, которая включает дополнительные действия, чтобы ответить на вопрос «что мне делать на стороне».

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

Руководство в первую очередь сосредоточено на разработке Frontend, но включает в себя только введение в Backend, позволяющее понять «весь процесс» и подготовиться к продуктивному вступлению в команду Full Stack в качестве уверенного и способного Frontend Developer.

Уровень 0 - Подготовка

Цель: освоить git к середине уровня 1 и освоить Precalculus к середине уровня 2.

Все, что находится на уровне 0, можно изучить до начала уровня 1 или вместе с остальной частью руководства по мере прохождения других уровней.

Уровень 1 - Введение в программирование

Цель: овладеть HTML, CSS и JavaScript.

Уровень 2 - Добавить сложность

Цель: познакомиться с D3.js и React, чтобы улучшить свои навыки работы с JavaScript.

Уровень 3 - Практика

Цель: более глубоко практиковаться в разработке интерфейса и продолжать изучать JavaScript, чтобы убедиться, что вы понимаете алгоритмы и структуры данных, с которыми вы, вероятно, столкнетесь на собеседованиях (и на работе).

  • Проект: прочтите Как внести свой вклад в развитие открытого исходного кода и сделайте два вклада в проекты с открытым исходным кодом (по вашему выбору) к концу этого уровня.
  • Книга: Структуры открытых данных
  • Проект: Завершите все классические головоломки в CodinGame от простого к сложному к концу уровня.
  • Проект: Clone Medium. Включите: создать учетную запись, создать сообщение, опубликовать сообщение, отредактировать сообщение, добавить тему в сообщение, подписаться на пользователя, подписаться на тему, поддержать публикацию и домашнюю страницу с лентой последних сообщений, отслеживаемых пользователей и подписок.
  • Проект: выберите шаблон здесь, здесь или здесь и создайте интерфейс веб-сайта, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение, предназначенное только для внешнего интерфейса, на основе данных, полученных из выбранного вами API. Рассмотрите возможность создания его как расширения Chrome, мобильного приложения или приложения Electron.
  • Проект: выберите шаблон здесь, здесь или здесь и создайте интерфейс веб-сайта, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение, предназначенное только для внешнего интерфейса, на основе данных, полученных из выбранного вами API. Рассмотрите возможность создания его как расширения Chrome, мобильного приложения или приложения Electron.
  • Проект: проект полного стека по вашему выбору (идеи: клонировать Facebook, Reddit, Netflix, Slack) - подумайте о создании его как расширения Chrome, мобильного приложения или приложения Electron.
  • Проект: проект полного стека по вашему выбору (сделайте его грандиозным) - или сделайте месячный Speedrun проектов FreeCodeCamp.

Уровень 4 - Завершите все и подготовьтесь к собеседованию

Цель: уверенное интервью.

  • Проект: завершите все вопросы, которые у вас остались после Подготовка к собеседованию по JavaScript.
  • Проект: завершите любой из 100 дней CSS, который вам еще предстоит завершить.
  • Проект: создайте и усовершенствуйте свой сайт портфолио.
  • Проект: создайте и отшлифуйте свое резюме / резюме.
  • Проект: изучить и завершить все Комплект для подготовки к интервью HackerRank на сайте HackerRank.
  • Проект: продолжайте оттачивать свои навыки во время собеседования. Сделайте вклад в открытый исходный код в приоритетном порядке.

Что теперь?

  • Если вы хотите перейти к науке о данных - нажмите Руководство по науке о данных
  • Если вы предпочитаете алгоритмы и структуры данных - нажмите CS-WD Guide.
  • Если вам больше всего нравится веб-разработка - прочтите руководство WD-CS.

FAQ по этому руководству

Почему оно намного длиннее оригинального «Руководства по работе»?

То, что я наблюдал за последние 9 месяцев, - это два явления, первое из которых заключается в том, что многие «самодополняются» дополнительными проектами и ресурсами для начинающих во время работы с YDKJS, поэтому я расширил раздел для начинающих, чтобы облегчить «но что еще нужно?» Я делаю »вопрос. Во-вторых, наиболее успешные ученики также добавили к концу руководства более сложные проекты, поэтому я добавил больше сложных / продвинутых проектов, чтобы удовлетворить эту потребность.

Зачем столько математики и алгоритмов?

Это не ТАКОЕ математика, только через Precalculus, поэтому вы не почувствуете себя отстающим от кривой, когда захотите выйти за рамки просто «Готова к работе» и заняться более сложными проектами программирования. Алгоритмы - я добавил их, чтобы вы были подготовлены и уверены, что справитесь со всем, с чем можете столкнуться на собеседовании.

Где мне развернуть свой код?

Для всех проектов - храните свой код на GitHub, GitLab или BitBucket (предпочтительнее GitHub, если вы хотите, чтобы его позже увидели потенциальные работодатели), а для веб-проектов разверните код в Интернете с помощью службы по вашему выбору (GitHub или Проекты GitLab или Surge.sh идеально подходят для проектов только во внешнем интерфейсе, в то время как Heroku - бесплатная альтернатива для бэкэнда / полного стека).

Почему изменились выборки проектов?

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

У вас есть список полезных ссылок, которые укажут мне правильное направление, если мне нужен продуктивный перерыв или нужно проконсультироваться с официальной документацией, пока я работаю над всем этим?

Да, да, я знаю:

  • На тот случай, когда вам нужен быстрый / веселый продуктивный перерыв, который научит вас использовать CSS для макета сайта (еще раз посетите этот раздел на Уровне 1 - одни только зомби Flexbox окажутся чрезвычайно полезным обучением макету страницы для ранних проектов).
  • CSS Diner
  • FlexBox Defense
  • FlexBox Froggy
  • Сетка сад
  • FlexBox Zombies
  • Когда вам нужен быстрый / веселый продуктивный перерыв, во время которого вы также практикуете JavaScript.
  • Недоверенный
  • Сага о лифте
  • Скрипы
  • Когда вам нужны активы / идеи
  • Pixabay
  • Unsplash
  • Пекселс
  • LibreStock
  • Google Fonts
  • Бесплатные наборы иконок FlatIcon
  • Официальные документы
  • MDN HTML - для изучения всего, что может предложить HTML.
  • MDN CSS - за изучение всего, что может предложить CSS.
  • MDN JavaScript - для изучения всего, что может предложить JavaScript.
  • Sass - CSS с наддувом
  • Node.js - должен быть вашим основным ориентиром при создании серверных проектов.
  • Express - отличный фреймворк для сопровождения Node.js на бэкэнде.
  • MongoDB - для хранения данных
  • Mongoose - упрощенный доступ к MongoDB из Node.js (er)
  • Passport.js - запомните эту ссылку, когда вам нужно настроить систему входа в систему.
  • D3 - для создания потрясающих графиков и диаграмм.
  • Angular - опция для создания одностраничных приложений на веб-интерфейсе.
  • React - опция для создания одностраничных приложений на веб-интерфейсе.
  • Vue - опция для создания одностраничных приложений на веб-интерфейсе
  • Redux - для управления состоянием в одностраничном приложении
  • Мокко - предприятие на тестирование
  • Карма - предприятие на тестирование
  • Jest - затея в тестировании
  • Webpack - сборщик модулей для использования в процессе сборки (чтобы вы могли, среди прочего, минимизировать свой HTML / CSS / JavaScript и доставить оптимизированную сборку в производство)
  • Babel - заставляет новый JavaScript работать в старых браузерах (или версиях узлов, если на то пошло).
  • Gulp - для автоматизации рабочего процесса
  • ESLint - за помощь в поддержании чистоты вашего кода
  • Prettier - больше поможет сохранить ваш код в чистоте
  • Travis - непрерывное развертывание (как запускать сборку / развертывание всякий раз, когда вы фиксируете свои изменения через git)

Руководство по работе - Python Edition

Ориентированная на Python версия Job Ready Guide, узко ориентированная на развитие навыков, которые, вероятно, необходимы, чтобы быстро перейти к «готовому к работе» Python-разработчику.

Приготовьтесь к работе - версия Python

Уровень 0 - Подготовка

Цель: освоить git к середине уровня 1 и освоить Precalculus к середине уровня 2.

Все, что находится на уровне 0, можно изучить до начала уровня 1 или вместе с остальной частью руководства по мере прохождения других уровней.

Уровень 1. Необходимость внешнего интерфейса, отличного от Python, для веб-разработки.

Цель: овладеть HTML, CSS и JavaScript, в том числе фреймворком / библиотекой внешнего интерфейса по вашему выбору, а также D3.

Уровень 2 - Основы Python

Цель: познакомиться с Python, MongoDB и фреймворком Flask или Django и начать развивать навыки создания полностековых веб-приложений с Python на бэкэнде.

  • Задача: Подготовка к собеседованию по Python на Hackerrank. Зарегистрируйтесь сейчас и решайте проблемы вместе с руководством по мере продвижения.
  • Курс: M001: Основы MongoDB - примечание: этот курс предлагается только периодически, зарегистрируйтесь в начале уровня, затем перейдите к другим курсам и вернитесь к этому, когда он будет в сеансе.
  • Курс: MM220P: MongoDB для разработчиков Python - примечание: этот курс предлагается только периодически, зарегистрируйтесь в начале уровня, затем перейдите к другим курсам и вернитесь к этому, когда он будет в сеансе.
  • Курс: Введение в информатику и программирование с использованием Python
  • Изучите: Руководство пользователя Flask или документация Django - выберите, исходя из того, что более распространено в вашем регионе, что вы лично предпочитаете, или любые другие критерии, которые вы выберете, но выберите один и внимательно изучите его. Изучите руководства, прочтите все, изучите тестирование, аутентификацию, базы данных, все это.
  • Проект: клонируйте Twitter, используя Python на бэкэнде и вашу фреймворк / библиотеку на ваш выбор. Включите все основные функции: регистрация / вход / выход, подписка на пользователя, поиск, твит, лайк / ретвит, домашняя страница с потоком последних твитов.
  • Курс: Исчисление одной переменной
  • Проект: принять участие в одном конкурсе Бот-программирование.
  • Книга: Think Python
  • Исследование: Инструмент тестирования pytest внимательно прочтите документацию, поэкспериментируйте с примерами и научитесь работать с pytest (включая unittest и нос).
  • Проект: принять участие в одном конкурсе Бот-программирование.
  • Проект: Clone Medium. Включите: создать учетную запись, создать сообщение, опубликовать сообщение, отредактировать сообщение, добавить тему в сообщение, подписаться на пользователя, подписаться на тему, поддержать публикацию и домашнюю страницу с лентой последних сообщений, отслеживаемых пользователей и подписок.
  • Проект: сделайте недельный спидран для проектов FreeCodeCamp, завершив как можно больше проектов за семь дней.

Уровень 3 - больше Python и базовая CS

Цель: изучить Python на более глубоком уровне, чтобы убедиться, что вы понимаете алгоритмы и структуры данных, с которыми вы, вероятно, столкнетесь на собеседованиях (и на работе).

Уровень 4 - Завершите все и подготовьтесь к собеседованию

Цель: уверенное интервью.

  • Проект: Завершите все вопросы, которые у вас остались после Подготовка к собеседованию по Python.
  • Проект: усовершенствуйте и отполировайте свое портфолио.
  • Проект: создайте и отшлифуйте свое резюме / резюме.
  • Проект: Cracking the Coding Interview на HackerRank
  • Проект: продолжайте оттачивать свои навыки во время собеседования. Участвуйте в большем количестве соревнований ботов на CodinGame, участвуйте в соревнованиях на Kaggle, участвуйте в проектах на JavaScript или Python с открытым исходным кодом, работайте над сторонними проектами, которые демонстрируют ваши навыки внешнего интерфейса.

Что теперь?

  • Если вам действительно понравилось погружение в машинное обучение - прочтите Руководство по науке о данных.
  • Если вы предпочитаете алгоритмы и структуры данных - нажмите CS-WD Guide
  • Если вам больше всего нравится веб-разработка - загляните в WD-CS Guide.

FAQ по этому руководству

Почему оно намного длиннее, чем другое Руководство по работе с вакансиями?

Наиболее заметное различие между этим и исходным руководством Job Ready состоит в том, что оно значительно длиннее, но все же начинается с YDKJS. Это связано с тем, что для того, чтобы использовать Python для веб-разработки, вам также потребуется определенное знание основных тем внешнего интерфейса (HTML, CSS, JavaScript).

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

Зачем столько математики и алгоритмов?

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

Где мне развернуть свой код?

Для всех проектов - храните свой код на GitHub, GitLab или BitBucket (предпочтительнее GitHub, если вы хотите, чтобы его позже увидели потенциальные работодатели), а для веб-проектов разверните код в Интернете с помощью службы по вашему выбору (GitHub или Проекты GitLab или Surge.sh идеально подходят для проектов только во внешнем интерфейсе, в то время как Heroku - бесплатная альтернатива для бэкэнда / полного стека).

Какой Python мне использовать?

Когда вы перейдете на уровень 2 - я настоятельно рекомендую установить версию Anaconda для Python 3 для использования в той части руководства, которая ориентирована на Python. Он помещает вашу среду Python в контейнер, чтобы ничто из того, что вы делаете, не влияло на остальную часть вашего компьютера, содержит все плагины, которые могут вам понадобиться, и даже предоставляет Spyder IDE, которая является идеальной начальной установкой для разработки Python.

Информатика и внутренняя разработка - Java Focus

Глубокое погружение в компьютерные науки с акцентом на Java

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

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

Если возникнут вопросы, обязательно загляните в FAQ. Фактически, прежде чем что-либо начинать, прочтите FAQ. В нем есть множество советов и ответов, которые помогут вам максимально эффективно использовать это руководство.

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

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

Конкретные идеи проекта

  • Клонировать популярный веб-сайт, либо с акцентом на какой-то причудливый интерфейс, либо с акцентом на надежный API с минимальным интерфейсом, необходимым для его тестирования.
  • Клонируйте практически любой шаблон, который вы найдете в Интернете, но делайте это в Kotlin как приложение для Android.
  • Создайте / клонируйте игру
  • Нажмите Kaggle и соберите ядро ​​для решения одной из проблем там.
  • Нажмите HackerRank или CodinGame, чтобы на неделю решить проблемы, решив как можно больше проблем.
  • Создайте утилиту командной строки, которая автоматизирует то, что вы часто делаете.
  • Сделайте свой PR для проекта с открытым исходным кодом по вашему выбору
  • Напишите серию сообщений / руководств в блогах, в которых подробно объясняется какая-то тема, которую вы изучаете.
  • Создание приложения, которое вы хотите, было доступно, но нет

Уровень 1 - начало работы

Уровень 2 - развивайте больше знаний

Уровень 3 - добавить больше строгости

Уровень 4 - отполировать неровные края

Компьютерные науки и веб-разработка - комплексные

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

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

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

Если возникнут вопросы, обязательно загляните в FAQ. Фактически, прежде чем что-либо начинать, прочтите FAQ. В нем есть множество советов и ответов, которые помогут вам максимально эффективно использовать это руководство.

Уровень 1 - начало работы

Уровень 2 - развивайте больше знаний

Уровень 3 - добавить больше строгости

Уровень 4 - отполировать неровные края

Веб-разработка с помощью основ компьютерных наук - комплексная

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

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

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

Если возникнут вопросы, обязательно загляните в FAQ. Фактически, прежде чем что-либо начинать, прочтите FAQ. В нем есть множество советов и ответов, которые помогут вам максимально эффективно использовать это руководство.

Уровень 1 - начало работы

Уровень 2 - укрепите свой фундамент

Уровень 3 - строить на фундаменте

Уровень 4 - отполировать неровные края

  • Проект: прочтите Travis CI - попробуйте включить его в любой проект, который находится в активной разработке или который вы собираетесь продолжать в Интернете.
  • Курс: Линейная алгебра - основы границ
  • Проект: Клонировать Twitter - да, весь функционал
  • Курс: Компьютерная графика
  • Курс: Искусственный интеллект
  • Курс: Машинное обучение
  • Проект: разработка, реализация, тестирование и развертывание игры, в которую можно играть в Интернете, с использованием технологий по вашему выбору. Единственным критерием является то, чтобы в нее можно было играть онлайн и чтобы она содержала существенный компонент ИИ.
  • Проект: Завершите все классические головоломки - очень сложно в CodinGame на JavaScript
  • Проект: создайте модуль узла, который преобразует уценку в правильно отформатированный html.
  • Проект: создайте модуль npm, который загружает приложение fullstack с Node.js на бэкэнде и библиотекой / фреймворком SPA по вашему выбору во внешнем интерфейсе. Включите полный набор тестов и комплексные процессы сборки. Опубликуйте его в NPM.
  • Проект: Выполните все задачи из всех этапов Google Code Jam 2016 - прокрутите вниз до соответствующего раздела.
  • Проект: расширьте структуру сетки CSS, включив в нее CSS и JavaScript, необходимые для реализации от 5 до 10 компонентов материального дизайна.
  • Проект: Клон Учись гармонии
  • Project: Clone Slack - функциональность должна быть завершена до такой степени, что один пользователь может создавать комнату, приглашать других пользователей, а все пользователи этой комнаты могут общаться в чате в реальном времени. Помещение должно быть безопасным и недоступным для всех, кроме приглашенных.

Data Science - комплексный

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

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

Цель: опытный и способный специалист по данным, владеющий Python, R, математикой, естественными науками и алгоритмами, стандартными для науки о данных.

Учебный план, охватывающий темы Data Science, относящиеся к машинному обучению, биоинформатике и искусственному интеллекту. Включает необходимые знания в области математики и естественных наук.

Предложения:

  • Делайте все курсы / книги по порядку
  • Ничего не пропускайте (если у вас возникает соблазн пропустить курс, потому что вы думаете, что уже знаете его, пройдите финал, если вы его прошли, то пропустите).
  • Проекты перечислены в конце каждого уровня, вы должны считать, что они назначены в начале уровня и должны быть выполнены в конце - поэтому работайте над ними вместе с книгами и курсами, когда вы продвигаетесь через уровень.
  • Для любого проекта не стесняйтесь использовать Python или R. Python представлен ранее в руководстве, поэтому, вероятно, вы будете использовать его почти исключительно для более ранних проектов. Было бы неплохо больше полагаться на R в последних проектах, чтобы иметь возможность практиковаться в обоих.
  • Постарайтесь создать свой профиль GitHub во время учебы, чтобы со временем вы могли отображать историю проектов в области науки о данных.
  • Если вы еще этого не сделали, начните писать в блоге о том, что вы изучаете, на Medium (или в другом месте). Постарайтесь сосредоточиться на обучающих материалах по хорошо изученным вами темам, которые могут быть полезны другим.

Примечание. Все элементы должны иметь возможность бесплатного аудита. Есть два курса по алгоритмам, которые требуют покупки книги (Cormen), но я предоставил альтернативные курсы, которые этого не делают.

Блоги

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

Уровень 0 - подготовка

Уровень 1 - фундаменты

Уровень 2 - развивайте больше знаний

Уровень 3 - добавить больше строгости

Уровень 4 - практическое применение

Уровень 5 - Бонусный раунд - Продвинутый

Программирование видеоигр - всеобъемлющие основы

Разрабатывайте множество игр, сначала на JavaScript, а затем на C ++, изучая принципы информатики, важные для разработки игр ... при этом развлекаясь в процессе.

Цель: научиться программировать видеоигры

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

Уровень 0 - «Вкус» новичка в программировании игр - на основе JavaScript.

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

Получите некоторый опыт создания графики с помощью JavaScript с помощью processing.js

  • Курс: Введение в JS: рисование и анимация
  • Проект: выполните все задания курса рисования и анимации.
  • Курс: Advanced JS: игры и визуализации
  • Проект: выполните все задания курса "Игры и визуализации".
  • Курс: Advanced JS: Natural Simulations
  • Проект: Выполните все задания курса "Моделирование природы".
  • Проект: создайте игру «Домашний проект» в Khan Academy, используя все навыки, которые вы приобрели с processing.js. Убедитесь, что на нем есть как минимум экран «Начало игры», хотя бы один уровень играбельной игры, в которой ведется подсчет очков, и экран «Игра окончена».

Изучите немного математики и алгоритмов, чтобы вы могли вычислить

  • Книга: Precalculus (можете пропустить, если вы уже изучаете математику по 30 минут в день в Khan Academy)
  • Курс: Алгоритмы

Ознакомьтесь с Phaser и настройте свои закладки в Phaser Docs и полезные ссылки для получения / создания ресурсов.

Постройте их - по порядку - сложность нарастает с каждым из них.

1-го уровня

2 уровень

Уровень 3

4 уровень

5 уровень

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

Теперь, когда у вас действительно прочный фундамент, нет предела. Выберите платформу, для которой вы хотите разработать: Android, iOS, Windows, Linux, Mac, Интернет, XBox, Playstation или что угодно - и начинайте читать. Начните с официальных документов, прочтите их все. Найдите блоги, посвященные этой платформе. Перестройте некоторые из самых простых проектов, которые вы сделали до сих пор, на эту платформу.

Используйте силу: D

Закладки, которые у вас должны быть

  • Surge.sh - разверните здесь свои фронтенд-проекты (или используйте страницы github)
  • MDN - смотрите здесь HTML, CSS и JavaScript.
  • Heroku - разверните здесь свои проекты fullstack (или Hyperdev)
  • Firebase или mLab - хостинг баз данных
  • Материальный дизайн - положитесь на него, когда вам нужна структура для создания минималистичного, но потрясающе выглядящего сайта.
  • Палитра материалов - для выбора цветовых схем.
  • GitHub - сохраните здесь свой код
  • GIMP - графический редактор
  • Blender - пакет для создания 3D
  • Inkscape - векторная графика
  • Tiled - редактор тайловой карты
  • Leshy SpriteSheet Tool - инструмент HTML5 для создания, упаковки и изменения листов спрайтов и текстурных атласов.
  • OpenGameArt - игровое искусство с открытым исходным кодом (проверьте авторские права, некоторые из них более открыты, чем другие)
  • Wirify - для быстрого превращения веб-страницы в каркас, чтобы вы могли видеть общую картину, а не всю графику.

Для каждого игрового проекта

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

Если вам нужен продуктивный перерыв от курса или книги, чтобы очистить голову, СОЗДАЙТЕ ИГРУ, а затем вернитесь к списку. Вот несколько идей (некоторые из них уже есть в списках выше):

  • Понг
  • Зорк
  • Вдохновитель
  • Головоломка памяти
  • Галага
  • PacMan
  • Прорыв
  • Пасьянс
  • Flappy Bird
  • Космические захватчики
  • Супер Марио Братья
  • Фруктовый ниндзя
  • Последний бой
  • Тетрис
  • Злые птицы
  • Украшенный драгоценностями
  • Сокобан
  • Катамари Дамаси
  • Блэкджек (с противниками AI)
  • Шашки (с AI противником)
  • Осел Конг
  • Трон (два игрока, с возможностью многопользовательской игры или соперника с искусственным интеллектом)
  • Покемон
  • Монополия (1–4 игрока, с возможностью многопользовательской игры или AI-противника)
  • Бомбардировщик
  • Diablo
  • Zelda
  • Коса
  • Шахтерское ремесло
  • Риск
  • Лунный посадочный модуль
  • Уличный боец
  • Castlevania

Собственное программирование под Android - всестороннее

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

Цель: стать опытным и способным разработчиком Android.

В этом руководстве широко используются «официальные документы» для Java и Android, а также проекты и курсы из программ Udacity Android Nanodegree, дополненные уровнем «Компьютерные науки», чтобы гарантировать, что ваша способность создавать приложения для Android экспертного уровня не будет затруднены нечеткой математикой или обучением алгоритму.

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

Уровень 0 - Основы CS / Java

Уровень 1. Основы Android

Уровень 2 - Android среднего уровня

Уровень 3 - Больше CS

Уровень 4 - Расширенный Android

Продвинутые идеи проектов

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

Глубокие погружения по конкретным темам

Комплексный обзор узких тем.

Regex - подробное описание темы

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

Это руководство в настоящее время находится «на стадии бета-тестирования» и ожидает выхода ресурса для уровня 2.

Уровень 1 - основы

Уровень 2 - практика

  • Практика: Regex Classroom - созданный замечательным Чингу @ksmai

Уровень 3 - магия регулярных выражений linux

Уровень 4 - практика

Угловой - Глубокое погружение в тему

Ниже приводится подробное описание, призванное подробно познакомить вас с Angular. Это не «легкий путь к тому, чтобы просто изучить« достаточно »» - он нацелен гораздо выше, сочетая тщательное изучение официальной документации, регулярные практические проекты, всестороннее изучение TypeScript, Karma, Jasmine и Protractor и использование не-Angular TypeScript. Практикуйтесь, чтобы обеспечить прочную основу во всем, что касается Angular.

Уровень 0 - ссылка, только если вам нужны основы до Angular

  • Курс: Введение в информатику - CS50 (Если вы хотите больше уверенности в программировании)
  • Статьи: Как не испортить локальные файлы с помощью Git part1, part2 и part 3 (если вы хотите использовать git, прочтите их, чтобы быстро освоиться).
  • Курс: Научитесь кодировать HTML и CSS (Введение, чтобы вы начали работать с HTML и CSS)
  • Курс: Learn to Code Advanced HTML & CSS (Дополнительная инструкция по HTML и CSS)
  • Курс: Получение Sassy с помощью CSS (погрузитесь в Sass, попробуйте выполнить это до того, как закончите руководство)
  • Серия книг: YDKJS (Вам нужно ЗНАТЬ JavaScript, а не просто знать JavaScript, если вы не изучали эти книги, сделайте себе одолжение и изучите их вместе с тем, чем вы еще могли бы заниматься)
  • Официальные документы: ESLint - внимательно прочтите руководство пользователя.
  • Официальные документы: Axios npm package - внимательно просмотрите, он вам понадобится для вызовов API.

Уровень 1 - основы

Тщательно изучите каждый пункт. Введите код. Разберитесь, как это работает. Да, в целом.

Вам НЕОБХОДИМО знать JavaScript - если вы не уверены в JavaScript, сделайте себе одолжение - нажмите MDN и изучите, особенно функции ES6, - и нажмите YDKJS.

По каждому проекту:

  • Используйте рабочий процесс git (если вам интересно, что это такое, прочтите статьи на уровне 0)

Как минимум для одного проекта:

  • Использовать угловой материал
  • Используйте Bootstrap
  • Официальная документация: TypeScript за 5 минут
  • Официальная документация: Angular - Об Angular, все разделы, особое внимание уделите разделу ресурсов, а внутри него: Angular CLI, Augury, Codelyzer, Lite-Server и Ionic.
  • Официальная документация: Angular - Начало работы
  • Официальная документация: Angular - Учебник, все разделы
  • Официальная документация: Flexbox
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Angular, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальные документы: Карма - все вступительные разделы
  • Официальные документы: Jasmine - начало работы (Jasmine Standalone)
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Angular, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Подкаст: Приключения в Angular - послушайте одну серию на ваш выбор.
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Angular, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Подкаст: AngularAir - посмотрите одну серию на ваш выбор.
  • Проект: CodeWars - выполнить 10 задач с использованием TypeScript.
  • Официальная документация: CSS Grid Layout
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Angular, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: Руководство по JavaScript в MDN тщательно изучите три главы.

Уровень 2 - помимо основ

Тщательно изучите каждый пункт. Введите код. Разберитесь, как это работает. Да, в целом.

По каждому проекту:

  • Используйте рабочий процесс git
  • Включите не менее 20 автоматических тестов

Как минимум для одного проекта:

  • Использовать угловой материал
  • Используйте Bootstrap
  • Официальная документация: Основные типы TypeScript через Конфигурация проекта Руководства по TypeScript.
  • Проект: CodeWars - выполнить 20 задач с использованием TypeScript.
  • Официальные документы: Karma - все разделы конфига
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Angular, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: Angular - Основы, все разделы
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Angular, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Подкаст: Приключения в Angular - послушайте одну серию на ваш выбор.
  • Подкаст: AngularAir - посмотрите одну серию на ваш выбор.
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Angular на основе данных, полученных из выбранного вами API.
  • Проект: CodeWars - выполнить 20 задач с использованием TypeScript.
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Angular, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: Руководство по JavaScript в MDN тщательно изучите три главы.

Уровень 3 - средний

Тщательно изучите каждый пункт. Введите код. Разберитесь, как это работает. Да, в целом.

По каждому проекту:

  • Используйте рабочий процесс git
  • Включите не менее 20 автоматических тестов
  • Используйте Sass
  • Внедрение сквозного тестирования

Как минимум для одного проекта:

  • Использовать угловой материал
  • Используйте Bootstrap
  • Официальная документация: Angular - Приемы, все разделы
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Angular, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальные документы: Jasmine Docs - изучение целиком
  • Книга: Глубокое погружение в TypeScript
  • Официальные документы: Быстрый запуск транспортира
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Angular, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальные документы: Protractor Setup
  • Проект: Google Code Jam - пройдите отборочный тур любого прошедшего конкурса с помощью TypeScript.
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Angular на основе данных, полученных из выбранного вами API.
  • Подкаст: Приключения в Angular - послушайте одну серию на ваш выбор.
  • Подкаст: AngularAir - посмотрите одну серию на ваш выбор.
  • Официальная документация: Клиентское хранилище MDN
  • Официальные документы: RxJS Docs
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Angular на основе данных, полученных из выбранного вами API.
  • Проект: CodeWars - выполнить 20 задач с использованием TypeScript.
  • Официальная документация: Руководство по JavaScript в MDN тщательно изучите три главы.

Уровень 4 - выше среднего

Тщательно изучите каждый пункт. Введите код. Разберитесь, как это работает. Да, в целом.

По каждому проекту:

  • Используйте рабочий процесс git
  • Включите не менее 20 автоматических тестов
  • Используйте Sass
  • Внедрение сквозного тестирования

Как минимум для одного проекта:

  • Использовать угловой материал
  • Используйте Bootstrap

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

  • Официальная документация: Angular - API, все разделы
  • Официальные документы: Protractor Tests
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Angular на основе данных, полученных из выбранного вами API.
  • Официальные документы: Справочник транспортира
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Angular на основе данных, полученных из выбранного вами API.
  • Подкаст: Приключения в Angular - послушайте одну серию на ваш выбор.
  • Проект: CodeWars - выполнить 20 задач с использованием TypeScript.
  • Подкаст: AngularAir - посмотрите одну серию на ваш выбор.
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Angular на основе данных, полученных из выбранного вами API.
  • Официальные документы: Документы Webpack
  • Официальные документы: Gulp Docs
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя TypeScript.
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Angular, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Angular на основе данных, полученных из выбранного вами API.
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Angular, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Angular на основе данных, полученных из выбранного вами API.
  • Официальная документация: Руководство по JavaScript в MDN тщательно изучите три главы.
  • Проект: используйте все, что вы узнали, для создания всеобъемлющего портфолио, демонстрирующего ваши способности с Angular, рефакторинг предыдущих проектов по мере необходимости, чтобы довести их до уровня ваших текущих способностей.

Бонус - продвинутый

  • Официальная документация: Ionic Framework Тщательно изучите, а затем реорганизуйте любой предыдущий проект в мобильное приложение с помощью Ionic.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Официальные документы: Доступность MDN
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя TypeScript.
  • Проект: клонировать крупный производственный веб-сайт (на уровне Medium, Twitter и т. Д.)
  • Напишите подробное руководство по Angular - опубликуйте его публично
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя TypeScript.
  • Изучите исчерпывающий текст по структурам данных и алгоритмам (например, Cormen или Sedgewick или свободно доступную книгу Open Data Structures) и реализуйте все структуры данных и алгоритмы в TypeScript.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя TypeScript.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя TypeScript.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя TypeScript.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.

Полезные ссылки

Когда вам нужны активы / идеи

Официальные документы

  • MDN HTML - для изучения всего, что может предложить HTML.
  • MDN CSS - за изучение всего, что может предложить CSS.
  • MDN JavaScript - для изучения всего, что может предложить JavaScript.
  • Sass - CSS с наддувом
  • D3 - для создания потрясающих графиков и диаграмм.
  • Angular - опция для создания одностраничных приложений на веб-интерфейсе.
  • Карма - предприятие на тестирование
  • Jest - затея в тестировании
  • Webpack - сборщик модулей для использования в процессе сборки (чтобы вы могли, среди прочего, минимизировать свой HTML / CSS / JavaScript и доставить оптимизированную сборку в производство)
  • Babel - заставляет новый JavaScript работать в старых браузерах (или версиях узлов, если на то пошло).
  • Gulp - для автоматизации рабочего процесса
  • ESLint - за помощь в поддержании чистоты вашего кода
  • Prettier - больше поможет сохранить ваш код в чистоте
  • Travis - непрерывное развертывание (как запускать сборку / развертывание всякий раз, когда вы фиксируете свои изменения через git)

Vue - Глубокое погружение в тему

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

Уровень 0 - ссылка, только если вам нужны основы до Vue

  • Курс: Введение в информатику - CS50 (Если вы хотите больше уверенности в программировании)
  • Статьи: Как не испортить локальные файлы с помощью Git part1, part2 и part 3 (если вы хотите использовать git, прочтите их, чтобы быстро освоиться).
  • Курс: Научитесь кодировать HTML и CSS (Введение, чтобы вы начали работать с HTML и CSS)
  • Курс: Learn to Code Advanced HTML & CSS (Дополнительная инструкция по HTML и CSS)
  • Курс: Получение Sassy с помощью CSS (погрузитесь в Sass, попробуйте выполнить это до того, как закончите руководство)
  • Серия книг: YDKJS (Вам нужно ЗНАТЬ JavaScript, а не просто знать JavaScript, если вы не изучали эти книги, сделайте себе одолжение и изучите их вместе с тем, чем вы еще могли бы заниматься)
  • Официальные документы: ESLint - внимательно прочтите руководство пользователя.
  • Официальные документы: Axios npm package - внимательно просмотрите, он вам понадобится для вызовов API.

Уровень 1 - основы

Тщательно изучите каждый пункт. Введите код. Разберитесь, как это работает. Да, в целом.

Вам НЕОБХОДИМО знать JavaScript - если вы не уверены в JavaScript, сделайте себе одолжение - нажмите MDN и изучите, особенно функции ES6, - и нажмите YDKJS.

По каждому проекту:

  • Используйте рабочий процесс git (если вам интересно, что это такое, прочтите статьи на уровне 0)

Как минимум для одного проекта:

  • Кодируйте весь CSS самостоятельно
  • Используйте Bootstrap
  • Официальные документы: Руководство по Vue.js - все разделы в Essentials
  • Официальная документация: Flexbox
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Vue, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: Vue DevTools
  • Официальная документация: Руководство по стилю Vue.js - правила приоритета A
  • Официальная документация: CSS Grid Layout
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Vue, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: Примеры Vue.js - просмотрите все примеры и выберите один, который сможете реализовать самостоятельно.
  • Официальные документы: Vue Loader
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Vue, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальные документы: vue-test-utils
  • Проект: CodeWars - выполнить 10 задач с помощью JavaScript.
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Vue, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: Руководство по JavaScript в MDN тщательно изучите три главы.

Уровень 2 - помимо основ

Тщательно изучите каждый пункт. Введите код. Разберитесь, как это работает. Да, в целом.

По каждому проекту:

  • Используйте рабочий процесс git
  • Включите не менее 20 автоматических тестов

Как минимум для одного проекта:

  • Кодируйте весь CSS самостоятельно
  • Используйте Bootstrap
  • Официальные документы: Руководство по Vue.js - Все разделы в Transitions & Animation
  • Официальная документация: Руководство по Vue.js - все разделы в разделе Повторное использование и композиция.
  • Проект: CodeWars - выполнить 20 задач с помощью JavaScript.
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Vue, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальные документы: Руководство по Vue.js - Все разделы в Tooling
  • Официальные документы: Руководство по стилю Vue.js - Правила приоритета B
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Vue, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: Примеры Vue.js - просмотрите все примеры и выберите один, который сможете реализовать самостоятельно.
  • Официальная документация: Vue Router
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Vue на основе данных, полученных из выбранного вами API.
  • Проект: CodeWars - выполнить 20 задач с помощью JavaScript.
  • Официальные документы: Jest Docs
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Vue, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: Руководство по JavaScript в MDN тщательно изучите три главы.

Уровень 3 - средний

Тщательно изучите каждый пункт. Введите код. Разберитесь, как это работает. Да, в целом.

По каждому проекту:

  • Используйте рабочий процесс git
  • Включите не менее 20 автоматических тестов
  • Используйте Sass
  • Внедрение сквозного тестирования

Как минимум для одного проекта:

  • Кодируйте весь CSS самостоятельно
  • Используйте Bootstrap
  • Официальная документация: Руководство по Vue.js - все разделы в Scaling Up
  • Официальная документация: Руководство по Vue.js - Все разделы на внутреннем устройстве.
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Vue, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: Руководство по стилю Vue.js - правила приоритета C
  • Официальная документация: Примеры Vue.js - просмотрите все примеры и выберите один, который сможете реализовать самостоятельно.
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Vue, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: Vue.js API - Все разделы
  • Официальные документы: Документы Webpack
  • Официальные документы: RxJS Docs
  • Официальные документы: Gulp Docs
  • Проект: Google Code Jam - пройдите отборочный тур любого прошедшего конкурса с помощью JavaScript.
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Vue на основе данных, полученных из выбранного вами API.
  • Официальная документация: Jest API
  • Официальная документация: Клиентское хранилище MDN
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Vue на основе данных, полученных из выбранного вами API.
  • Проект: CodeWars - выполнить 20 задач с помощью JavaScript.
  • Официальная документация: Руководство по JavaScript в MDN тщательно изучите три главы.

Уровень 4 - выше среднего

Тщательно изучите каждый пункт. Введите код. Разберитесь, как это работает. Да, в целом.

По каждому проекту:

  • Используйте рабочий процесс git
  • Включите не менее 20 автоматических тестов
  • Используйте Sass
  • Внедрение сквозного тестирования

Как минимум для одного проекта:

  • Кодируйте весь CSS самостоятельно
  • Используйте Bootstrap
  • Реализуйте состояние с помощью Vuex
  • Реализовать состояние с помощью Redux

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

  • Официальные документы: Руководство по стилю Vue.js - правила приоритета D
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Vue на основе данных, полученных из выбранного вами API.
  • Официальная документация: Примеры Vue.js - просмотрите все примеры и выберите один, который сможете реализовать самостоятельно.
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Vue на основе данных, полученных из выбранного вами API.
  • Официальная документация: Шаблон Webpack
  • Проект: CodeWars - выполнить 20 задач с помощью JavaScript.
  • Официальные документы: Vuex
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Vue на основе данных, полученных из выбранного вами API.
  • Официальная документация: Руководство по рендерингу на стороне сервера Vue.js
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя JavaScript.
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Vue, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальные документы: Redux docs
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Vue на основе данных, полученных из выбранного вами API.
  • Проект: выберите шаблон здесь, здесь или здесь и создайте приложение Vue, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение Vue на основе данных, полученных из выбранного вами API.
  • Официальная документация: Руководство по JavaScript в MDN тщательно изучите три главы.
  • Проект: используйте все, что вы узнали, для создания всеобъемлющего портфолио, демонстрирующего ваши способности с Vue, рефакторинг предыдущих проектов по мере необходимости, чтобы довести их до уровня ваших текущих способностей.

Бонус - продвинутый

  • Официальная документация: Официальная документация Weex Тщательно изучите, а затем реорганизуйте любой предыдущий проект в мобильное приложение с помощью Weex
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя JavaScript.
  • Официальные документы: Доступность MDN
  • Проект: клонировать крупный производственный веб-сайт (на уровне Medium, Twitter и т. Д.)
  • Напишите подробное руководство по Vue - опубликуйте его публично
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя JavaScript.
  • Изучите исчерпывающий текст по структурам данных и алгоритмам (например, Cormen или Sedgewick или свободно доступную книгу Open Data Structures) и реализуйте все структуры данных и алгоритмы на JavaScript.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя JavaScript.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя JavaScript.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя JavaScript.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.

Полезные ссылки

Когда вам нужны активы / идеи

Официальные документы

  • MDN HTML - для изучения всего, что может предложить HTML.
  • MDN CSS - за изучение всего, что может предложить CSS.
  • MDN JavaScript - для изучения всего, что может предложить JavaScript.
  • Sass - CSS с наддувом
  • D3 - для создания потрясающих графиков и диаграмм.
  • Vue - опция для создания одностраничных приложений на веб-интерфейсе
  • Карма - предприятие на тестирование
  • Jest - затея в тестировании
  • Webpack - сборщик модулей для использования в процессе сборки (чтобы вы могли, среди прочего, минимизировать свой HTML / CSS / JavaScript и доставить оптимизированную сборку в производство)
  • Babel - заставляет новый JavaScript работать в старых браузерах (или версиях узлов, если на то пошло).
  • Gulp - для автоматизации рабочего процесса
  • ESLint - за помощь в поддержании чистоты вашего кода
  • Prettier - больше поможет сохранить ваш код в чистоте
  • Travis - непрерывное развертывание (как запускать сборку / развертывание всякий раз, когда вы фиксируете свои изменения через git)

React - Глубокое погружение в тему

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

Уровень 0 - ссылка, только если вам нужны основы pre-React

  • Курс: Введение в информатику - CS50 (Если вы хотите больше уверенности в программировании)
  • Статьи: Как не испортить локальные файлы с помощью Git part1, part2 и part 3 (если вы хотите использовать git, прочтите их, чтобы быстро освоиться).
  • Курс: Научитесь кодировать HTML и CSS (Введение, чтобы вы начали работать с HTML и CSS)
  • Курс: Learn to Code Advanced HTML & CSS (Дополнительная инструкция по HTML и CSS)
  • Курс: Получение Sassy с помощью CSS (погрузитесь в Sass, попробуйте выполнить это до того, как закончите руководство)
  • Серия книг: YDKJS (Вам нужно ЗНАТЬ JavaScript, а не просто знать JavaScript, если вы не изучали эти книги, сделайте себе одолжение и изучите их вместе с тем, чем вы еще могли бы заниматься)
  • Официальные документы: ESLint - внимательно прочтите руководство пользователя.
  • Официальные документы: Axios npm package - внимательно просмотрите, он вам понадобится для вызовов API.

Уровень 1 - основы

Тщательно изучите каждый пункт. Введите код. Разберитесь, как это работает. Да, в целом.

Вам НЕОБХОДИМО знать JavaScript - если вы не уверены в JavaScript, сделайте себе одолжение - нажмите MDN и изучите, особенно функции ES6, - и нажмите YDKJS.

По каждому проекту:

  • Используйте рабочий процесс git (если вам интересно, что это такое, прочтите статьи на уровне 0)

Как минимум для одного проекта:

  • Кодируйте весь CSS самостоятельно
  • Используйте React-Bootstrap
  • Видео: React Community Videos Выберите и посмотрите одно видео - не беспокойтесь о каждой детали.
  • Официальные документы: Intro To React - Все разделы
  • Официальная документация: Flexbox
  • Проект: выберите шаблон здесь, здесь или здесь и внедрите приложение React, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: React Quick Start - все разделы от Hello World до Thinking in React.
  • Проект: выберите шаблон здесь, здесь или здесь и внедрите приложение React, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: JSX In Depth
  • Официальная документация: React DevTools
  • Официальная документация: CSS Grid Layout
  • Официальные документы: Проверка типов с помощью PropTypes
  • Проект: выберите шаблон здесь, здесь или здесь и внедрите приложение React, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальные документы: Проверка статического типа
  • Проект: CodeWars - выполнить 10 задач с помощью JavaScript.
  • Проект: выберите шаблон здесь, здесь или здесь и внедрите приложение React, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: Руководство по JavaScript в MDN тщательно изучите три главы.
  • Официальные документы: React FAQ прочтите все разделы FAQ, от AJAX и API до Virtual DOM и Internals - запомните все в уме на случай, если вам понадобится вернуться к этому во время проектов.

Уровень 2 - помимо основ

Тщательно изучите каждый пункт. Введите код. Разберитесь, как это работает. Да, в целом.

По каждому проекту:

  • Используйте рабочий процесс git

Как минимум для одного проекта:

  • Кодируйте весь CSS самостоятельно
  • Используйте React-Bootstrap
  • Включите не менее 20 автоматических тестов
  • Видео: React Community Videos Выберите и посмотрите одно видео - не беспокойтесь о каждой детали.
  • Официальные документы: Ссылки и ДОМ
  • Официальные документы: Неконтролируемые компоненты
  • Официальные документы: Оптимизация производительности
  • Проект: CodeWars - выполнить 20 задач с помощью JavaScript.
  • Проект: выберите шаблон здесь, здесь или здесь и внедрите приложение React, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: React Router
  • Официальная документация: React Without ES6
  • Официальная документация: React Without JSX
  • Проект: выберите шаблон здесь, здесь или здесь и внедрите приложение React, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальные документы: Примирение
  • Официальные документы: Контекст
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение React, основанное на данных, полученных из выбранного вами API.
  • Проект: CodeWars - выполнить 20 задач с помощью JavaScript.
  • Официальные документы: Jest Docs
  • Официальные документы: Enzyme Docs
  • Проект: выберите шаблон здесь, здесь или здесь и внедрите приложение React, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Официальная документация: Руководство по JavaScript в MDN тщательно изучите три главы.

Уровень 3 - средний

Тщательно изучите каждый пункт. Введите код. Разберитесь, как это работает. Да, в целом.

По каждому проекту:

  • Используйте рабочий процесс git
  • Включите не менее 20 автоматических тестов
  • Внедрение сквозного тестирования

Как минимум для одного проекта:

Уровень 4 - выше среднего

Тщательно изучите каждый пункт. Введите код. Разберитесь, как это работает. Да, в целом.

По каждому проекту:

  • Используйте рабочий процесс git
  • Включите не менее 20 автоматических тестов
  • Внедрение сквозного тестирования

Как минимум для одного проекта:

  • Кодируйте весь CSS самостоятельно
  • Используйте React-Bootstrap
  • Реализовать состояние с помощью Redux

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

  • Видео: Видео сообщества React Выберите и посмотрите одно видео - убедитесь, что вы все поняли, сделайте паузу и исследуйте, если необходимо
  • Официальные документы: Документы Webpack
  • Официальные документы: RxJS Docs
  • Официальные документы: Gulp Docs
  • Официальные документы: Интеграция с другими библиотеками
  • Официальные документы: Redux docs
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение React, основанное на данных, полученных из выбранного вами API.
  • Официальные документы: Доступность
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение React, основанное на данных, полученных из выбранного вами API.
  • Официальные документы: Code-Splitting
  • Проект: CodeWars - выполнить 20 задач с помощью JavaScript.
  • Официальная документация: React Reference - все разделы
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение React, основанное на данных, полученных из выбранного вами API.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя JavaScript.
  • Проект: выберите шаблон здесь, здесь или здесь и внедрите приложение React, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение React, основанное на данных, полученных из выбранного вами API.
  • Проект: выберите шаблон здесь, здесь или здесь и внедрите приложение React, используя его в качестве источника вдохновения (не используйте его ресурсы).
  • Проект: выберите API из Списка API Тодда Мотто и создайте приложение React, основанное на данных, полученных из выбранного вами API.
  • Официальная документация: Руководство по JavaScript в MDN тщательно изучите три главы.
  • Проект: используйте все, что вы узнали, для создания всеобъемлющего портфолио, которое продемонстрирует ваши способности с React, рефакторинг предыдущих проектов по мере необходимости, чтобы довести их до уровня ваших текущих способностей.

Бонус - продвинутый

  • Официальная документация: React Native Тщательно изучите, а затем реорганизуйте любой предыдущий проект в мобильное приложение с помощью React Native.
  • Официальная документация: Flow Тщательно изучите, а затем выполните рефакторинг любого предыдущего проекта для использования Flow.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя JavaScript.
  • Официальные документы: Доступность MDN
  • Проект: клонировать крупный производственный веб-сайт (на уровне Medium, Twitter и т. Д.)
  • Напишите подробное руководство по React - опубликуйте его публично
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя JavaScript.
  • Изучите исчерпывающий текст по структурам данных и алгоритмам (например, Cormen или Sedgewick или свободно доступную книгу Open Data Structures) и реализуйте все структуры данных и алгоритмы на JavaScript.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя JavaScript.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя JavaScript.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.
  • Проект: Google Code Jam - завершите один раунд любого прошедшего конкурса, используя JavaScript.
  • Проект: внесите вклад с открытым исходным кодом в используемый вами проект.

Практика Speedrun

Практика по конкретной теме, чтобы составить портфолио, получить дополнительный опыт в определенной области или заранее составить список заданий, которые нужно выполнить для практического ускоренного прохождения, чтобы вывести свои способности на следующий уровень (проверьте раздел Алгоритмы для подготовки к собеседованию или практика для соревнований по программированию на Python, Java, C ++ или JavaScript):

Атрибуция

Вывод

Эта статья была вдохновлена ​​P1x т. Перекомпилировано и опубликовано Тобилоба Адехумо.