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
Ціль прострочена на 1061 день

Мета закинута

Автор не відписував в цілі 3 року 3 месяця 24 дня

Автор мети

Fedor

Росія, Йошкар-Ола

22 Рік / року / років

Загальна

Стать 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 попытка.

  • 6480
  • 18 лютого 2019, 16:14

Реєстрація

Можливості
безмежні.
Настав час
відкрити свої.

Уже зарегистрированы?
Вхід на сайт

Заходьте.
Відкрито.

Ще не зареєстровані?
 
Підключіться до будь-якого з ваших акаунтів, ваші дані будуть взяті з акаунту.
Забули пароль?