Карта развития веб-разработчика

Содержание

• Каждый уважающий себя разработчик должен знать:

  • Книги
  • Английский язык
  • Архитектура компьютера
  • Linux, командная строка Bash
  • Структуры данных
  • HTML & CSS
  • Объектно-ориентированное программирование
  • Функциональное программирование
  • Системы управления версиями
  • Протокол HTTP
  • Тестирование
  • Безопасность сайтов
  • Тайм-менеджмент

• Карта развития Back-end разработчика:

  • Алгоритмы
  • Серверные языки программирования
  • Паттерны программирования
  • Принципы программирования
  • Регулярные выражения
  • SQL
  • Проектирование баз данных
  • Фреймворки
  • Пакетный менеджер
  • Устройство веб-серверов и способы взаимодействия
  • Развертывание проектов

• Карта развития Front-end разработчика:

  • JavaScript
  • Адаптивный/отзывчивый веб-дизайн
  • JavaScript библиотеки
  • Препроцессоры CSS
  • Сборщик проектов
  • Пакетный менеджер
  • CSS фреймворки
  • JavaScript фреймворки
  • Одностраничное приложение

---

Каждый уважающий себя разработчик должен знать ↑

Книги ↑

Это — книги «на все времена». Лучшие в своем роде и важные для программистов любых направлений.

• Жизнь:

  • Цель. Процесс непрерывного совершенствования (Элия М. Гольдратт, Джеф Кокс)
  • Идеальный программист. Как стать профессионалом разработки ПО (Роберт К. Мартин)
  • Джоэл о программировании (Джоэл Х. Спольски)
  • Джоэл и снова о программировании (Джоэл Х. Спольски)

• Архитектура компьютера:

  • Код. Тайный язык информатики (Чарльз Петцольд)

• Программирование:

  • Структура и интерпретация компьютерных программ (Харольд Абельсон, Джеральд Джей Сассман)
  • Алгоритмы. Вводный курс (Томас Х. Кормен)
  • Совершенный код (Стив Макконнелл)
  • Чистый код: создание, анализ и рефакторинг (Роберт Мартин)
  • Рефакторинг. Улучшение существующего кода (Мартин Фаулер)

• Операционные системы:

  • Операционная система UNIX (Андрей Робачевский, Сергей Немнюгин, Ольга Стесик)
  • Руководство администратора Linux (Эви Немет, Гарт Снайдер, Трент Р. Хейн)

• Люди:

  • Человеческий фактор. Успешные проекты и команды (Том ДеМарко, Тимоти Листер)
  • Мифический человеко-месяц, или Как создаются программные системы (Хилл Чапел, Фредерик Брукс)
  • Как сдвинуть гору Фудзи? Подходы ведущих мировых компаний к поиску талантов (Уильям Паундстоун)

---

Английский язык ↑

Цель - развить навык свободного чтения на английском языке.

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

• Ресурсы (Не обязательно выбирать все ресурсы, выберите или найдите то, что вам больше нравится):
  • Duolingo
  • Lingualeo
  • Babadum
  • Anki программа для облегчения запоминания слов
  • Medium блог-платформа, читать и писать статьи

---

Архитектура компьютера ↑

Цель - познакомиться с концептуальной структурой вычислительных машин.

• Книга:
  • Код. Тайный язык информатики (Чарльз Петцольд)

---

Linux, командная строка Bash ↑

Цель - понять как работают операционные системы. Научиться базовому администрированию.

• Ресурсы:
  • Курс: Bash: Основы командной строки (Hexlet)
  • Статья: Искусство командной строки (статья)
  • Статья: Руководство по установке Debian GNU/Linux
  • Книга: Операционная система UNIX (Андрей Робачевский, Сергей Немнюгин, Ольга Стесик)
  • Книга: Руководство администратора Linux (Эви Немет, Гарт Снайдер, Трент Р. Хейн)

---

Структуры данных ↑

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

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

• Понимание:

  • Списки
  • Хеш-таблица
  • Стек
  • Очередь
  • Граф
  • Связный список
  • Деревья
  • Двоичное дерево поиска

• Статьи:

  • Структуры данных для самых маленьких

• Книги:

  • Совершенный код (Стив Макконнелл) глава 12 Основные типы данных
  • Структура и интерпретация компьютерных программ (Харольд Абельсон, Джеральд Джей Сассман)

---

HTML & CSS ↑

• Усвоить понятия:

  • Верстка
  • HTML 5
  • Разметка
  • Семантика
  • Cтили
  • Cелекторы
  • Анимация

• Документации, курсы:

  • htmlbook
  • MDN
  • HTML academy
  • Введение в schema.org (yandex)

---

Объектно-ориентированное программирование ↑

• Усвоить понятия:

  • Класс
  • Объект
  • Абстракция данных
  • Инкапсуляция
  • Наследование
  • Полиморфизм

• Книга:

  • Объектно-ориентированное конструирование программных систем (Бертран Мейер)

---

Функциональное программирование ↑

• Усвоить понятия:

  • Абстракция данных
  • Функция высшего порядка
  • Чистые функции
  • Рекурсия
  • Замыкания
  • Неизменяемый объект

• Статьи:

  • Функциональное программирование для всех (habrahabr)
  • Умение видеть абстракции (habrahabr)

• Книга:

  • Структура и интерпретация компьютерных программ (Харольд Абельсон, Джеральд Джей Сассман)

---

Системы управления версиями ↑

• Усвоить понятия:

  • Ветвления
  • Слияние
  • Конфликты и их разрешение
  • Версии проекта, теги
  • Базовые принципы разработки ПО в VCS
  • Ежедневный цикл работы

• Курс:

  • Git How To

• Книга:

  • Pro Git (Scott Chacon, Ben Straub)

---

Протокол HTTP ↑

Цель - понять, как браузер взаимодействует с веб-сервером.

• Усвоить понятия:

  • User-agent
  • DNS
  • Отличия HTTP 2.0 от версий 1.x
  • Тело HTTP-запроса
  • Передача данных
  • Отправка форм
  • Transfer-Encoding
  • Перенаправления
  • Базовая аутентификация
  • Cookies

• Статьи:

  • Простым языком об HTTP (habrahabr)
  • HTTP: протокол, который каждый разработчик должен знать (часть 1)
  • HTTP: протокол, который каждый разработчик должен знать (часть 2)
  • HTTP запрос
  • HTTP ответ

• Курс:

  • Протокол HTTP (Hexlet)

---

Тестирование ↑

• Виды тестов:

  • Блочное тестирование (модульное, unit testing)
  • Интеграционное тестирование
  • Системное тестирование

• Изучить методологии:

  • Разработка через тестирование (TDD)
  • разработка, основанная на функционировании (BDD)

• Статьи:

  • Виды тестирования и подходы к их применению (habrahabr)
  • Test-Driven Development — телега или лошадь? (habrahabr)

---

Безопасность сайтов ↑

• Уязвимости:

  • SQL-инъекция
  • Межсайтовый скриптинг или XSS
  • Демонстрация ошибок пользователю
  • Доступность данных о характеристиках системы пользователю
  • Инъекция через загрузку файлов
  • E-mail-инъекция
  • Кража сессии

• Книга:

  • Секреты хакеров. Безопасность Web-приложений - готовые решения (Джоел Скамбрэй, Майк Шема)

• Статья:

  • Top 5 уязвимостей PHP безопасности

---

Тайм-менеджмент ↑

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

Методы:

• Метод «Помидора»
• Метод Парето
• Метод «Альп»
• Матрица Эйзенхауэра

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

• Статьи:
  • Как планировать время: 7 самых популярных техник тайм-менеджмента
  • Тайм-менеджмент для разработчика
  • Управление временем (Wikipedia)

---

Карта развития Back-end разработчика ↑

Алгоритмы ↑

• Познакомиться с алгоритмами:

  • Сортировки
  • Поиска в строке
  • Обхода и поиска в структурах данных
  • На графах

• Статьи:

  • Пузырьковая сортировка и все-все-все (habrahabr)
  • Алгоритмы поиска в строке (habrahabr)
  • Алгоритмы и структуры данных поиска. Лекции и курсы от Яндекса (habrahabr)
  • Алгоритм Дейкстры. Поиск оптимальных маршрутов на графе (habrahabr)

• Книга:

  • Алгоритмы. Вводный курс (Томас Х. Кормен)

---

Серверные языки программирования ↑

Цель - освоить несколько серверных языков программирования.

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

Лозунг: нужно программировать не на языке программирования, а используя его.

• Примеры серверных языков:

  • PHP
  • Python
  • Ruby

• Статьи:

  • Типы данных
  • Функциональное программирование
  • Объектно-ориентированное программирование
  • Тестирование

---

Паттерны программирования ↑

• Познакомиться cо слелующими типами паттернов:

  • Порождающие шаблоны проектирования
  • Структурные шаблоны проектирования
  • Поведенческие шаблоны проектирования

• Статьи:

  • DesignPatternsPHP
  • Шаблон проектирования (wikipedia)
  • Шпаргалка по шаблонам проектирования (habrahabr)
  • Справочник «Паттерны проектирования»
  • Design Patterns for Humans (Github)
  • Каталог паттернов проектирования

• Видео:

  • Webinar: Patterns (Hexlet)

• Книга:

  • Приемы объектно-ориентированного проектирования. Паттерны проектирования (Э. Гамма, Р. Хелм, Р. Джонсон, Д. Влиссилес.)

---

Принципы программирования ↑

• Познакомиться с принципами:

  • DRY
  • KISS
  • YAGNI
  • SOLID

• Статья:

  • Принципы программирования (wikipedia)

---

Регулярные выражения ↑

• Усвоить понятия:

  • Квантификация
  • Жадность
  • Группировка

• Статьи:

  • Регулярные выражения (wikipedia)
  • Жадные и ленивые квантификаторы (learn.javascript)

---

SQL ↑

• Усвоить понятия:

  • DDL, DML, DQL
  • Создание и удаление базы данных, таблицы
  • Добавление, обновление и удаление записи
  • Схема (SCHEMA)
  • Представления (VIEWS)
  • WHERE
  • LIMIT, OFFSET
  • ORDER BY
  • GROUP BY
  • JOIN
  • Подзапросы

• Статьи:

  • Что такое SQL (wikipedia)
  • Схема базы данных (wikipedia)
  • Представления в MySQL (habrahabr)
  • Квалифицированный выбор при использовании предложений
  • Полнотекстовый поиск и его возможности (habrahabr)

• Курсы:

  • Базы данных: SQL (DDL/DML) (Hexlet)
  • Базы данных: SQL (DQL) (Hexlet)

---

Проектирование баз данных ↑

• Усвоить понятия:

  • Нормализация
  • Денормализация
  • Связи

• Статьи:

  • Проектирование баз данных (wikipedia)
  • Нормальная форма (wikipedia)
  • Нормализация отношений. Шесть нормальных форм (habrahabr)
  • Денормализация БД. Зачем? Когда? Как? (habrahabr)

---

Фреймворки ↑

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

• PHP фреймворки:

  • Slim microframework
  • Laravel
  • Symfony
  • Yii

• Python фреймворки:

  • Django
  • Flask

• Ruby фреймворки:

  • Ruby on Rails

• Статьи:

  • Фреймворк (wikipedia)
  • Не учите фреймворки, учите архитектуру (habrahabr)

---

Пакетный менеджер ↑

• Список пакетных менеджеров:

  • Для PHP - composer
  • Для Python - pip
  • Для Ruby - bundler
  • Для Javascript - npm, yarn

• Статьи:

  • Composer — менеджер зависимостей для PHP (habrahabr)
  • npm для простых смертных (habrahabr)

---

Устройство веб-серверов и способы взаимодействия ↑

• Усвоить понятия:

  • HTTP
  • NGINX
  • APACHE
  • Треды
  • Worker
  • CGI
  • FastCGI
  • event Loop

• Статьи:

  • Протокол HTTP (devmap)
  • Веб-сервер (wikipedia)
  • Модели работы веб-серверов

---

Развертывание проектов ↑

• Усвоить понятия:

  • Деплой
  • Миграции
  • Релизы
  • Еnvironment
  • Непрерывная интеграция (CI)

• Статьи:

  • Версионная миграция структуры базы данных: основные подходы (habrahabr)
  • Нумерация версий ПО для новичков и не только (habrahabr)
  • Automated git deployments from Bitbucket
  • How to use Vagrant for local web development
  • Vagrant для малышей, или как на Windows легко получить настроенный сервер для разработки веб-приложений

---

Карта развития Front-end разработчика ↑

JavaScript ↑

• Познакомиться с такими понятиями как:

  • Переменные
  • Типы данных
  • Функции
  • Рекурсия
  • Замыкания
  • Область видимости
  • Объекты
  • События
  • DOM

• Документации, книги:

  • Eloquent JavaScript
  • learn.javascript
  • MDN
  • ECMAScript 6 features

---

Адаптивный/отзывчивый веб-дизайн ↑

• Усвоить понятия:

  • Адаптивный веб-дизайн
  • Отзывчивый веб-дизайн
  • Media queries
  • Mobile first
  • Graceful degradation
  • RESS

• Статьи:

  • 9 отличий адаптивного дизайна от «резинового» в GIF-картинках
  • Сравнение методов создания мобильных версий сайтов (habrahabr)

---

JavaScript библиотеки ↑

Цель - познакомиться с наиболее популярными библиотеками JavaScript. Знать где и когда их применять.

Список библиотек:

• jQuery
• ReactJS
• Underscore - набор полезных функций
• Modernizr - обнаруживает HTML5 и CSS3 функции в браузере пользователя
• Babel - компилятор для написания JavaScript следующего поколения
• Three - 3D
• WOW - анимация при прокрутки страницы
• Moment - Работа с датой и временем
• Mocha - написание тестов

Список наиболее популярных библиотек есть на Javascripting

---

Препроцессоры CSS ↑

• Усвоить понятия:

  • Переменные
  • Миксины
  • Функции
  • Импорт
  • Минификация

• Список препроцессоров CSS:

  • Sass/Scss
  • Less
  • Stylus

• Статьи:

  • Руководство по написанию разумного, поддерживаемого и масштабируемого Sass

---

Сборщик проектов ↑

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

• Сборщики проектов:

  • Gulp
  • Grunt
  • Webpack

• Статьи:

  • Приятная сборка frontend проекта (habrahabr)
  • Gulp — как глоток свежего воздуха после Grunt
  • The Gulp file generator

---

Пакетный менеджер ↑

• Список пакетных менеджеров:

  • Bower
  • npm
  • Yarn

• Статьи:

  • Пакетный менеджер (Backend)
  • npm для простых смертных (habrahabr)

---

CSS фреймворки ↑

• Список фреймворков:

  • Bootstrap
  • Skeleton
  • Foundation

• Статьи:

  • Длинная телега про Бутстрап

---

JavaScript фреймворки ↑

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

Список фреймворков:

• AngularJS
• Vue - создание интерактивных интерфейсов
• Backbone
• Ember

---

Одностраничное приложение ↑

Одностраничное приложение или SPA (single page application) - сайт или веб-приложение, использующий единственный HTML-документ как оболочку для всех веб-страниц и организующий взаимодействие с пользователем через динамически подгружаемые HTML, CSS, JavaScript, обычно посредством AJAX.

• Изучить:

  • JavaScript фреймворки
  • Роутинг
  • Шаблонизатор
  • API, например REST
  • AJAX

• Статьи:

  • Одностраничное приложение (wikipedia)
  • Пишем single-page web application framework в 60 строках кода (habrahabr)