1

Этап 1

Сбор рабочего места для web-разработки.

23 февраля—23 февраля

2

Этап 2

Ступени производства web-сайта.

24 февраля—25 февраля

3

Этап 3

Труд в Photoshop с дизайн-макетом.

26 февраля—28 февраля

4

Этап 4

База HTML. Каталог с веб-сайтом. Автоматизированное обновление веб-страницы.

01 марта—02 марта

5

Этап 5

Ознакомление с основами CSS.

03 марта—04 марта

6

Этап 6

Позиционирование в CSS.

04 марта—04 марта

7

Этап 7

Верстка дизайн-макета.

05 марта—09 марта

8

Этап 8

Форсирование верстки в несколько крат.

10 марта—11 марта

9

Этап 9

Верстание с помощью Twitter Bootstrap 4.

11 марта—12 марта

10

Этап 10

LESS.

13 марта—13 марта

11

Этап 11

Сниппеты.

14 марта—14 марта

12

Этап 12

GitHub.

15 марта—15 марта

13

Этап 13

Адаптивная вёрстка.

16 марта—16 марта

14

Этап 14

Шрифты.

17 марта—17 марта

15

Этап 15

Псевдоклассы и псевдоэлементы.

18 марта—18 марта

16

Этап 16

Слайдер.

19 марта—19 марта

17

Этап 17

Модальное окно.

20 марта—20 марта

18

Этап 18

Табы и аккордеон.

21 марта—21 марта

19

Этап 19

Анимация на CSS3.

22 марта—22 марта

20

Этап 20

Видеофон на сайте.

23 марта—23 марта

21

Этап 21

Эффект Parallax.

24 марта—24 марта

22

Этап 22

Карты на сайте.

25 марта—25 марта

23

Этап 23

Хостинг.

26 марта—26 марта

24

Этап 24

Аналитика для сайта.

27 марта—27 марта

25

Этап 25

Формы.

28 марта—28 марта

26

Этап 26

Как делаются многостраничные сайты

29 марта—29 марта

27

Этап 27

WordPress - движок для сайта. Часть 1.

30 марта—30 марта

28

Этап 28

WordPress - движок для сайта. Часть 2.

31 марта—31 марта

29

Этап 29

Тестирование верстки.

01 апреля—01 апреля

30

Этап 30

Портфолио и резюме.

02 апреля—03 апреля

31

Этап 31

Поиск заказчика

04 апреля—05 апреля

32

Этап 32

Ведение клиентов. Общение и CRM

06 апреля—07 апреля

33

Этап 33

Набивать портфолио(апрель)

08 апреля—30 апреля

34

Этап 34

Набивать портфолио(май)

01 мая—31 мая

35

Этап 35

Набивать портфолио и делать сниппеты(июнь)

01 июня—30 июня

36

Этап 36

Поизучать JS.

01 августа—26 октября

37

Этап 37

Попрактиковать JS. (1 часть)

27 октября—31 декабря

38

Этап 38

Попрактиковать JS. (2 часть)

01 января—26 января

39

Этап 39

Пауза

26 января—17 марта

40

Этап 40

HTML + CSS Практика(3 заход)

17 марта—05 мая

41

Этап 41

Текстовый редактор на vanilla JavaScript за месяц. (Неудача).

05 мая—31 мая

42

Этап 42

Текстовый редактор на vanilla JavaScript за месяц. Попытка 2. (Неудача)

01 июня—30 июня

43

Этап 43

Текстовый редактор на vanilla JavaScript за месяц. Попытка 3. (Неудача)

01 июля—31 июля

44

Этап 44

Текстовый редактор на vanilla JavaScript за месяц. Попытка 4.

01 августа—31 августа

45

Этап 45

Закончить курс от Владилена Минина (практический Node.js)

12 января—24 января

46

Этап 46

1С. WorldSkills. Занять 1 или 2 место. (Провал)

19 января—01 марта

47

Этап 47

TTS Telegram bot проект (Node.js)

22 марта—31 марта

48

Этап 48

Погодный бот (Node.js проект)

31 марта—11 апреля

49

Этап 49

Вики бот (Node.js проект)

01 апреля—30 апреля

50

Этап 50

Пауза на учёбу

01 сентября—30 июня

51

Этап 51

Парсер (Node.js проект)

52

Этап 52

Устроиться на работу программистом (Неудачно)

09 июня—26 июня

53

Этап 53

Устроиться на работу программистом. 2 попытка.

01 июля—01 августа

1

Этап 1

Сбор рабочего места для web-разработки.

23 февраля—23 февраля

2

Этап 2

Ступени производства web-сайта.

24 февраля—25 февраля

3

Этап 3

Труд в Photoshop с дизайн-макетом.

26 февраля—28 февраля

4

Этап 4

База HTML. Каталог с веб-сайтом. Автоматизированное обновление веб-страницы.

01 марта—02 марта

5

Этап 5

Ознакомление с основами CSS.

03 марта—04 марта

6

Этап 6

Позиционирование в CSS.

04 марта—04 марта

7

Этап 7

Верстка дизайн-макета.

05 марта—09 марта

8

Этап 8

Форсирование верстки в несколько крат.

10 марта—11 марта

9

Этап 9

Верстание с помощью Twitter Bootstrap 4.

11 марта—12 марта

10

Этап 10

LESS.

13 марта—13 марта

11

Этап 11

Сниппеты.

14 марта—14 марта

12

Этап 12

GitHub.

15 марта—15 марта

13

Этап 13

Адаптивная вёрстка.

16 марта—16 марта

14

Этап 14

Шрифты.

17 марта—17 марта

15

Этап 15

Псевдоклассы и псевдоэлементы.

18 марта—18 марта

16

Этап 16

Слайдер.

19 марта—19 марта

17

Этап 17

Модальное окно.

20 марта—20 марта

18

Этап 18

Табы и аккордеон.

21 марта—21 марта

19

Этап 19

Анимация на CSS3.

22 марта—22 марта

20

Этап 20

Видеофон на сайте.

23 марта—23 марта

21

Этап 21

Эффект Parallax.

24 марта—24 марта

22

Этап 22

Карты на сайте.

25 марта—25 марта

23

Этап 23

Хостинг.

26 марта—26 марта

24

Этап 24

Аналитика для сайта.

27 марта—27 марта

25

Этап 25

Формы.

28 марта—28 марта

26

Этап 26

Как делаются многостраничные сайты

29 марта—29 марта

27

Этап 27

WordPress - движок для сайта. Часть 1.

30 марта—30 марта

28

Этап 28

WordPress - движок для сайта. Часть 2.

31 марта—31 марта

29

Этап 29

Тестирование верстки.

01 апреля—01 апреля

30

Этап 30

Портфолио и резюме.

02 апреля—03 апреля

31

Этап 31

Поиск заказчика

04 апреля—05 апреля

32

Этап 32

Ведение клиентов. Общение и CRM

06 апреля—07 апреля

33

Этап 33

Набивать портфолио(апрель)

08 апреля—30 апреля

34

Этап 34

Набивать портфолио(май)

01 мая—31 мая

35

Этап 35

Набивать портфолио и делать сниппеты(июнь)

01 июня—30 июня

36

Этап 36

Поизучать JS.

01 августа—26 октября

37

Этап 37

Попрактиковать JS. (1 часть)

27 октября—31 декабря

38

Этап 38

Попрактиковать JS. (2 часть)

01 января—26 января

39

Этап 39

Пауза

26 января—17 марта

40

Этап 40

HTML + CSS Практика(3 заход)

17 марта—05 мая

41

Этап 41

Текстовый редактор на vanilla JavaScript за месяц. (Неудача).

05 мая—31 мая

42

Этап 42

Текстовый редактор на vanilla JavaScript за месяц. Попытка 2. (Неудача)

01 июня—30 июня

43

Этап 43

Текстовый редактор на vanilla JavaScript за месяц. Попытка 3. (Неудача)

01 июля—31 июля

44

Этап 44

Текстовый редактор на vanilla JavaScript за месяц. Попытка 4.

01 августа—31 августа

45

Этап 45

Закончить курс от Владилена Минина (практический Node.js)

12 января—24 января

47

Этап 47

TTS Telegram bot проект (Node.js)

22 марта—31 марта

48

Этап 48

Погодный бот (Node.js проект)

31 марта—11 апреля

52

Этап 52

Устроиться на работу программистом (Неудачно)

09 июня—26 июня

53

Этап 53

Устроиться на работу программистом. 2 попытка.

01 июля—01 августа

46

Этап 46

1С. WorldSkills. Занять 1 или 2 место. (Провал)

19 января—01 марта

49

Этап 49

Вики бот (Node.js проект)

01 апреля—30 апреля

50

Этап 50

Пауза на учёбу

01 сентября—30 июня

51

Этап 51

Парсер (Node.js проект)

18 февраля 2019 31 декабря 2021
Цель просрочена на 1057 дней

Цель заброшена

Автор не отписывался в цели 3 года 3 месяца 20 дней

Автор цели

Общая

Стать Node.js разработчиком

Делаю проекты по Node.js, читаю по нему книжки и смотрю подкасты (и планирую зарегистрироваться на каких-нибудь форумах и как-то обсуждать Ноду) для того чтобы получить кучу опыта и устроиться в компанию в своем городе!

А ещё изучаю разные штуки, связанные с Нодой или с программированием в общем (дизайн паттерны, алгоритмы, best practices).

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

 Критерий завершения

Устроиться в компанию (любую)

 Личные ресурсы

Время - 2 часа на проект (макс.) и 2 часа на чтение книжек и пробывание чего-то нового

Знания и навыки - никаких навыков по Ноде

 Экологичность цели

Хочу зарабатывать деньги и заниматься любимым делом.

  1. Сбор рабочего места для web-разработки.

    На данном этапе нужно установить всё, что находится ниже.

    1. Photoshop

    2. Sublime Text 3

    3. Package Control (Плагин ST3)

    4. AutoFileName (Плагин ST3)

    5. Emmet (Плагин ST3)

    6. BracketHighlighter (Плагин ST3)

    7. All Autocomplete (Плагин ST3)

  2. Ступени производства web-сайта.

    Тут рассмотрю:
    Какие вообще есть ступени производства, опять-таки web-сайта;
    Какие вопросы в беседе с заказчиком нужно задавать и для чего;
    Для чего нужен прототип сайтам и естественно, что это вообще такое;
    И под конец, где этот прототип вообще можно изобразить;

    1. 5+2 ступеней производства web-сайта. От беседы до выпуска web-сайта.

    2. Что есть прототип web-сайта и для чего он необходим.

    3. Места для изображения прототипа.

  3. Труд в Photoshop с дизайн-макетом.

    На этом этапе я рассмотрю:

    1.Требования, которые предъявляются к дизайн-макету сайта:

    • Верная ширина содержимого
    • Группирование по слоям и директориям
    • Исходные файлы шрифтов и графики
    • Соблюдение сетки в 12 колонок
    • Нарисованные эффекты при наведении

    2.Труд в Photoshop:

    • Hotkeys для работы веб-дизайнера.
    • Производство документа.
    • Работа со слоями и директориями.
    • Smart-objects в макете.
    • Шрифты и начертания (куда смотреть?).
    • Как верно вырезать графику.
    • Иконки и изображения с прозрачным фоном для веба.
    • Как сберечь графику для сайта (формат, имя, размер и т.п.)

    Также вырежу графику из макета (Фоновые изображения и иконки)

    1. Требования к дизайн-макету.

    2. Труд в photoshop.

  4. База HTML. Каталог с веб-сайтом. Автоматизированное обновление веб-страницы.

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

    • Как писать HTML.
    • Виды тегов (Требующие/не требующие закрытия).
    • "Голова документа" - скрытая часть. Служебные теги.
    • "Тело документа" - видимая часть.
    • Теги header, nav, section, article, footer.
    • Где просматривать все теги? Сервис htmlbook.

    2.Настройка SB3(Sublime Text 3) для скоростного верстания.

    • Плагин emmet
    • Установка node.js
    • Установка browser sync

    3.Создать каталог с веб-сайтом с необходимой структурой внутри.

    • Папка css в которой будет находится файл style.css
    • Папка fonts - в ней будут храниться шрифты для веб-сайта.
    • Папка js.
    • Папка img.
    • Файл index.html — это главный файл веб-сайта, нужно проследить, чтобы он не выглядел, как index.html.txt или что-то в этом роде.

    4.Сделать разметку документа index.html.

    • Использовать теги header, nav, section, article, footer.
    • Прочитать на webref.ru/html про теги: head, body, meta-теги, header, section, nav, article, footer.

    5.Установить необходимые программы: node.js и browser-sync для работы в будущем.

    • С необходимых сайтов: nodejs.org и browsersync.io.
    1. Разобраться с HTML.

    2. Настройка SB3(Sublime Text 3) для скоростного верстания.

    3. Создать каталог с веб-сайтом с необходимой структурой внутри.

    4. Сделать разметку документа index.html.

    5. Установить необходимые программы: node.js и browser-sync для работы в будущем.

  5. Ознакомление с основами CSS.

    Пути присоединения CSS:

    • Через тег link.
    • Через тег style.
    • Через @import.

    Труд с текстом в CSS:

    • Выравнивание текста.
    • Цвет текста.
    • Все заглавными буквами.
    • Подчеркнутый текст.
    • Зачеркнутый текст.

    Работа с цветом в CSS:

    • Кодировки цвета.
    • Цвет в rgb.
    • Кодировка #hex.

    Box-model CSS:

    • Блочные теги.
    • Строчные теги.
    • Строчно-блочные теги.

    Задачи:

    • Оформить мою миникнигу.
    • Добавить стили.
    • Выровнять заголовки по центру.
    • Добавить фон, рамки.
    • Жирный шрифт, курсив и подчеркивания обязательно перенести в CSS.
    1. Пути присоединения CSS

    2. Работа с текстом в CSS

    3. Цвета в CSS

    4. Блочная модель CSS

    5. Задачи

  6. Позиционирование в CSS.

    1. Масштабность и вышина для элементов.

    2. margin + padding + border.

    3. Способы позиционирования элементов.

    4. z-index.

    5. Обтекание элементов в потоке.

    Задачи:

    1. Создать документ HTML внутри которого должен находится элемент (шапка сайта с

    навигацией).

    • Шапка должна иметь fixed position и всегда находиться на самом верху страницы независимо от прокрутки и занимать всю ширину страницы.
    • Background-color шапки - black.
    • Color гиперссылок внутри header - white.
    • На веб-странице должен находится абзац с lorem ipsum на 20 * 5 * 10 слов.

    В header находится nav с 1 + 4 ссылками:

    • Новости.
    • Портфолио.
    • О нас.
    • Контакты.
    • Карта проезда.

    Все гиперссылки размещены как block-inline элементы.

    2. Создать документ HTML, в котором находится блочный элемент масштабностью 150 + 150 пикселей и вышиной 200 + 200 пикселей.

    • Элемент находится ровно по центру страницы по вертикали + горизонтали.
    • Этот блочный элемент имеет white background-color и grey border толщиной 1+1px.
    • Внутри блока есть внутренние отступы:
    • Сверху и снизу по 10 + 10px.
    • Слева и справа по 4 + 18 + 8px.
    1. 1. Масштабность и вышина для элементов.

    2. 2. margin + padding + border.

    3. 3. Способы позиционирования элементов.

    4. 4. z-index.

    5. 5. Обтекание элементов в процессе.

    6. 6. Задачи.

  7. Верстка дизайн-макета.

    Попробовать вёрстку:

    1. Визуальная разметка страницы.
    2. Создание скелета.
    3. Для чего нужны reset.css и normalize.css?
    4. Стилизация страницы.
    5. Завершение работы. Готовый сайт.

    Задачи:

    1. Скачать макет.
    2. Создать каталог с проектом.
    3. Подключить normalize или reset CSS.
    4. Сверстать макет на чистом HTML и CSS с использованием normalize или reset.
    1. Скачать макет.

    2. Создать каталог с проектом.

    3. Подключить normalize.css или reset.css.

    4. Сверстать макет на чистом HTML и CSS с использованием normalize.css или reset.css.

  8. Форсирование верстки в несколько крат.

    Включение Bootstrap для прорывного верстания.

    • Что такое верстка колонами?
    • Container.
    • 1 из 12 колон.
    • Пространство в колонах.
    • Завершенные классы в Bootstrap.
    • Buttons, forms и blocks.
    • Slider, windows и т.п.

    Миссия:

    1.Скачать дизайн-макет.

    2.Сверстать ряд, который имеет (5 + (0.5+0.5)) иконок. Отображаться они должны следующим образом:

    • на ультра малых дисплеях - в ряд по (0.5 + 0.5) иконке.
    • на малых дисплеях — в ряд по (0.5*4) иконки.
    • на средних дисплеях — в ряд по ((0.5*4) + (0.5+0.5)) иконки.
    • на больших дисплеях — в ряд по (0.5*12) колонок.

    3.В колоне всё отцентровать.

    Доп.миссия:

    • Разузнать, если успею быстро выполнить вышепоставленную миссию, о flexbox, с чем это едят и что это вообще такое.
    1. Скачать дизайн-макет.

    2. Сверстать ряд.

    3. В колоне всё отцентровать.

    4. Доп: ознакомиться с Flexbox.

  9. Верстание с помощью Twitter Bootstrap 4.

    Видимая маркировка документа.

    Формирование скелета и маркировка по grid.

    • Использование класса .container.
    • Для каждой новой строки — .row.
    • Что разделяет страницу — .col-.

    Украшение документа.

    • Сочинение CSS.
    • Окончание задачи. В итоге: сделанный веб-сайт.

    Упражнения.

    1. Cкачать дизайн-макет.
    2. Сделать вёрстку с использованием фреймворка Twitter Bootstrap 4 под разные разрешения дисплеев.
    1. Скачать дизайн-макет.

    2. Сделать вёрстку с использованием фреймворка Twitter Bootstrap 4 под разные разрешения дисплеев.

  10. LESS.

    Для чего нужен LESS и его основы.

    Что такое:

    • Миксины?
    • Компилятор?
    • Переменные?
    • Цвет и как с ним работать?
    • Вложенность?

    Задачи:

    • Написать(с использованием миксин и переменных) LESS код, который будет таким же как и в файле lesson.css.
  11. Сниппеты.

    Основы сниппетов.

    Как и для чего нужен:

    • Синтаксис сниппета.
    • Создается сниппет.
    • Пользоваться gist.
    • Установить сниппеты от Twitter Bootstrap 4.

    Задача:

    Создать сниппет стартового шаблона HTML:

    • Предвидеть позицию положения курсоров в сниппете.
    • Предписать все нужные метатеги.
    1. Предписать все нужные метатеги.

    2. Предвидеть позицию положения курсоров в сниппете.

  12. GitHub.

    GitHub

    Что такое и как этим пользоваться:

    • Github Pages.
    • Разметка для README.

    Задача:

    1. Загрузить ДЗ в подпапки в основном репозитории.
    2. Дать этим папкам понятное имя.
    3. Сделать страницу на README которая будет отсылаться на прошлые ДЗ.
    1. Загрузить папки с задачами в поддирректории в основном репо.

    2. Дать этим директориям понятное имя.

    3. Сделать страницу на README которая будет отсылаться на прошлые задачи.

  13. Адаптивная вёрстка.

    Адаптивная вёрстка

    Что такое и как его есть:

    • Расширение PerfectPixel.
    • Вёрстка Pixel Perfect.
    • Применение вёрстки Pixel Perfect.
    • Резиновая верстка.
    • Адаптивная верстка.
    • Медиа запросы.

    Задачи:

    1. Скачать макет формы.
    2. Сверстать этот макет.
    1. ​Скачать макет формы.

    2. Сверстать этот макет.

  14. Шрифты.

    Шрифты.

    Как или что такое:

    • Определять шрифты в макете.
    • Подключать шрифты через сервис Google Fonts.
    • Подключать специфичные шрифты.
    • Атрибуты шрифтов в таблицах стилей.

    Задачи:

    1. Скачать исходники.
    2. Подключить шрифты.
    1. ​Скачать исходники.

    2. Подключить шрифты.

  15. Псевдоклассы и псевдоэлементы.

    Псевдоклассы и псевдоэлементы

    Псевдоклассы.

    • :hover.
    • :focus.
    • :visited.
    • и т.д.

    Псевдоэлементы.

    • ::before.
    • ::after.
    • применение на практике.

    Задачи.

    • Сделать эффект затемнения изображений при наведении на них курсором мыши.
    • Сделать этот же эффект, только при наведении курсором на кнопки.
    1. ​Сделать эффект затемнения изображений при наведении на них курсором мыши.

    2. Сделать этот же эффект, только при наведении курсором на кнопки.

  16. Слайдер.

    Слайдер

    Как делать:

    • Подключить сторонние библиотеки к сайту.
    • Стандартный слайдер от Twitter Bootstrap 4.
    • Слайдер для фотографий Fotorama.
    • Слайдер для контента Slick Slider.

    Задача.

    • Сделать вёрстку слайдера для фотографий.

    С возможностью:

    • Просмотра миниатюры + развертывания на всю страницу.
    • Бесконечного прокручивания.
    • Прокручивания автоматически через каждые 2 секунды.
    1. Сделать вёрстку слайдера для фотографий.

  17. Модальное окно.

    Окно от Twitter Bootstrap 4.

    • Должна быть подключена сначала библиотека jQuery.
    • Подключены стили от Bootstrap (CSS).
    • Подключены js-файлы от Bootstrap.

    Окно от Magnific Popup.

    • Должна быть подключена сначала библиотека jQuery.
    • Подключены стили от Magnific Popup (CSS).
    • Подключены js-файлы от Magnific Popup.

    Окно на весь экран.

    • Должна быть подключена сначала библиотека jQuery.
    • Перенести стили из демо-архива (CSS).
    • Подключить js-файлы snap-svg и main.

    Задача

    Сверстать кнопку "Загрузить файл":

    • При клике на кнопку всплывает диалоговое окно с вопросом "Ты точно этого хочешь?"
    • Должны быть 2 варианта ответов: Нет и Да.
    • Окно должно иметь при себе крестик в верхнем углу, причём при клике на него можно закрыть данное модальное окно.
    1. Сверстать кнопку "Загрузить файл"

  18. Табы и аккордеон.

    Табы и аккордеон.

    Табы от Twitter Bootstrap 4.

    Для работы должны быть подключены:

    • Библиотека jQuery.
    • Стили от Twitter Bootstrap 4.
    • javascript-файлы от Twitter Bootstrap 4.

    Стандартный аккордеон от Twitter Bootstrap 4.

    Для работы должны быть подключены:

    • Библиотека jQuery.
    • Стили от Twitter Bootstrap 4.
    • Файлы javascript от Twitter Bootstrap 4.

    Задача.

    • Сделать форму регистрации с помощью табов.
    • Сделать аккордеон.
    1. Сделать форму регистрации с помощью табов.

    2. Сделать аккордеон.

  19. Анимация на CSS3.

    Анимация на CSS3.

    • Правило @keyframes
    • Ключевые кадры from,to.
    • Название анимации, длительность, задержка и т.п.
    • Временная функция анимации.
    • Множественные анимации.
    • Подключение animate.css.
    • Срабатывание анимации при пролистывании страницы.

    Задача:

    1. Установить библиотеку animate.css и wow.js.
    2. Анимировать форму регистрации.
    1. Установить библиотеку animate.css и wow.js.

    2. Анимировать форму регистрации.

  20. Видеофон на сайте.

    Видеофон на сайт.

    Подключение видеофона с помощью vide.js:

    • Подключение jQuery.
    • Инициализация плагина.
    • Подготовка видеофона.
    • Настройка видеофона и картинки на замену.
    • Выбор видеофона для сайта.

    Задача:

    1. Скачать с сайта видеофон и установить его на странице сайта в качестве видеофона с помощью vide.js.
    1. ​Скачать видеофон и установить его на сайте как видеофон с помощью vide.js.

  21. Эффект Parallax.

    Эффект Parallax.

    Parallax при движении мышью:

    • Подключение фона с Parallax.

    Relax при прокрутке страницы:

    • Настройка и подключение Parallax.

    Задача.

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

  22. Карты на сайте.

    Карты от яндекса.

    Карты от google.

    Карты от jsbox.

    Карты от 2gis.

    Задача.

    • Добавить интерактивную карту на веб-страницу.
    1. Добавить интерактивную карту на веб-страницу.

  23. Хостинг.

    Что такое и как с этим справляться:

    • Хостинг.
    • Домен.
    • FTP.
    • FTP конфигурирование.
    • Публикация сайта на хостинге.

    Задача.

    • Всё сделанное на GitHub опубликовать на нём.
    1. Всё сделанное на GitHub опубликовать на нём.

  24. Аналитика для сайта.

    Что такое или как?

    • Счетчик аналитики и веб-визор.
    • Установка счетчика от яндекса.
    • Настройка целей.
    • Установка счетчика от google.
    • Вставка пикселя ретаргетинга вк.

    Задача.

    1. Установить счетчик яндекса.
    2. В метрике настроить цели (нажатие на кнопку или переход на страницу).
    3. Проверить с помощью дебаггера работоспособность счетчика.
    1. Установить счетчик яндекса.

    2. В метрике настроить цели (нажатие на кнопку или переход на страницу).

    3. Проверить с помощью дебаггера работоспособность счетчика.

  25. Формы.

    Как работают формы на сайтах.

    Синтаксис у форм:

    • Синтаксис у PHP.
    • Ошибки при составлении форм.
    • Обработчик форм на сервере.

    Что такое и зачем:

    • Локальный сервер.

    Скрипт отправки письма через SMTP сервер:

    • Скрипт SMTP-отправки письма.

    Задача.

    1. Сделать отправление данных из формы в почту.
    2. Залить полученное на хостинг.
    1. Сделать отправление данных из формы в почту.

    2. Залить полученное на хостинг.

  26. Как делаются многостраничные сайты

    • PHP на многостраничнике.
    • Как выглядит простой многостраничный сайт.
    • Динамика на сайте.
    • Панель администратора на сайте.

    Задача.

    Сделать многостраничный сайт.

    Залить всё на хостинг.

    1. Сделать многостраничный сайт.

    2. Залить всё на хостинг.

  27. WordPress - движок для сайта. Часть 1.

    Что такое и как?

    • Движок.
    • WordPress на сервер.
    • Подготовка HTML.
    • Тема для WordPress.
    • Подключение изображений и сценариев.
    • Заполнение сайта.

    Задача.

    1. Натянуть верстку на Wordpress. (https://startbootstrap.com/themes)
    2. При этом должны работать сценарии и изображения.
    1. Натянуть верстку на Wordpress.

    2. Должны работать сценарии и изображения.

  28. WordPress - движок для сайта. Часть 2.

    Что такое и как?

    • Произвольные поля?
    • Сотворение и конфигурирование произвольных полей.
    • Верное присоединение сценариев и каскадных таблиц стилей.

    Задача.

    • На всех страницах должны работать изображения и сценарии.
    • Сценарии должны быть подключены верно с помощью functions.php
    • На сайте должны быть произвольные поля.
    1. На всех страницах должны работать изображения и сценарии.

    2. Сценарии должны быть подключены верно с помощью functions.php.

    3. На сайте должны быть произвольные поля.

  29. Тестирование верстки.

    Что такое:

    • Тестирование на валидность.
    • W3C стандарты.
    • Тесты на скорость загрузки.
    • Оптимизация сайта для быстрой загрузки.

    Задача.

    • Проверить сайт на валидность и исправить абсолютно все возможные ошибки.
    • Оптимизировать скорость загрузки сайта максимально хорошо.
    1. Проверить сайт на валидность и исправить абсолютно все возможные ошибки.

    2. Оптимизировать скорость загрузки сайта максимально хорошо.

  30. Портфолио и резюме.

    • Как составить хорошее резюме.
    • Сайт-портфолио.
    • Где еще размещать портфолио.
    • Страница в социальных сетях.
    • Блоггинг.

    Задача.

    • Сделать прототип своего портфолио.
    • Законспектировать видео.
    1. Сделать прототип портфолио.

    2. Сделать конспект.

  31. Поиск заказчика

    1. Группа вконтакте
    2. Аккаунт в Инстаграм
    3. Группа или страница на Фейсбук
    4. Канал на ютуб
    5. Блог на Wordpress
    6. Контекстная реклама (Яндекс и Google)
    7. Таргетинг Вконтакте
    8. Посев постов и промо посты Вконтакте
    9. Таргетинг на Facebook и Instagram
    10. Холодные звонки по клиентам на авито
    11. Холодные звонки по базам 2Gis, Яндекс.Карты, Google Maps
    12. Выставки (Москва и регионы)
    13. Техника «ТнЛинП»
    14. Ссылки на сайтах клиентов
    15. Партнерский маркетинг (Дизайнеры, копирайтеры, директологи и т.д.)
    16. Email рассылки по базам партнеров (или по подписчикам)
    17. Форумы и чаты (Экспертность)
    18. Реферальная система продаж
    19. Размещение на авито и др. Площадках
    20. Допродажи своим клиентам (не для новичков)
    21. Размещение портфолио на behance.net (http://behance.net/) и других площадках
    22. Тематические статьи в онлайн изданиях (или оффлайн)
    23. Бумажное письмо
    24. Полиграфия (визитки, листовки и т.д.)
    25. Своя книга, журнал и т.д.
    26. Ответы Гугл, ответы Мейл, toster, habrahabr и т.д.
    27. Продажа шаблнов

    Задача.

    1. Выписать список рекламных каналов
    2. Применить технику ТЛИНП
    1. Выписать список рекламных каналов.

    2. Применить технику ТЛИНП.

  32. Ведение клиентов. Общение и CRM

    • Как получать заказы и обратить на себя внимание заказчика?
    • Как назвать стоимость своей работы?
    • Как сделать так, чтобы тебя не кинули?
    • Правила работы с клиентами?
    • Что делать с недовольным заказчиком?
    • База клиентов?
    • Как сдавать проект, чтобы стоить дорого?
  33. Набивать портфолио(апрель)

    Нужен опыт, а также портфолио, чтобы было хотя бы какое-то доверие от заказчика
    На каждый день буду пытаться делать по 1 работе, если не успеваю за день, то за два
    А если вообще буду хуже успевать, то также буду удлинять сроки.

    Ресурсы с шаблонами буду брать отсюда:

    Шаблоны:

    1. Material Design

    2. Infinity

    3. Funder

    4. DrCare

  34. Набивать портфолио(май)

    1. Chimper

    2. Roberto

    3. Rapid

    4. Real Estate

    5. Medino

    6. Steak Shop

    7. The Event

    8. Digital Web

    9. Loaft

    10. eBusiness

    11. Carting

    12. Pointer

    13. Maxim

    14. Savage

    15. Amplify

    16. BizPage

  35. Набивать портфолио и делать сниппеты(июнь)

    1. Demand

    2. OneSchool

    3. NewBiz

    4. Mechanized

    5. BizCraft

    6. Ecoland

    7. Knight

    8. Educenter

  36. Поизучать JS.

  37. Попрактиковать JS. (1 часть)

    —Сделать редактор текста с Undo-Redo

  38. Попрактиковать JS. (2 часть)

    —Сделать редактор текста с Undo-Redo

  39. Пауза

  40. HTML + CSS Практика(3 заход)

  41. Текстовый редактор на vanilla JavaScript за месяц. (Неудача).

  42. Текстовый редактор на vanilla JavaScript за месяц. Попытка 2. (Неудача)

  43. Текстовый редактор на vanilla JavaScript за месяц. Попытка 3. (Неудача)

  44. Текстовый редактор на vanilla JavaScript за месяц. Попытка 4.

  45. Закончить курс от Владилена Минина (практический Node.js)

  46. 1С. WorldSkills. Занять 1 или 2 место. (Провал)

  47. TTS Telegram bot проект (Node.js)

    Весь код вот тут: https://github.com/pefbrute/tts-telegram-bot

  48. Погодный бот (Node.js проект)

    Весь код вот тут: https://github.com/pefbrute/weather-telegram-bot

  49. Вики бот (Node.js проект)

    Весь код вот тут: https://github.com/pefbrute/wiki-telegram-bot

  50. Пауза на учёбу

  51. Парсер (Node.js проект)

    Весь код вот тут: https://github.com/pefbrute/parser

  52. Устроиться на работу программистом (Неудачно)

  53. Устроиться на работу программистом. 2 попытка.

  • 6474
  • 18 февраля 2019, 16:14
Регистрация

Регистрация

Уже зарегистрированы?
Быстрая регистрация через соцсети
Вход на сайт

Входите.
Открыто.

Еще не зарегистрированы?
 
Войти через соцсети
Забыли пароль?