1

Step 1

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

23 February—23 February

2

Step 2

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

24 February—25 February

3

Step 3

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

26 February—28 February

4

Step 4

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

01 March—02 March

5

Step 5

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

03 March—04 March

6

Step 6

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

04 March—04 March

7

Step 7

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

05 March—09 March

8

Step 8

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

10 March—11 March

9

Step 9

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

11 March—12 March

10

Step 10

LESS.

13 March—13 March

11

Step 11

Сниппеты.

14 March—14 March

12

Step 12

GitHub.

15 March—15 March

13

Step 13

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

16 March—16 March

14

Step 14

Шрифты.

17 March—17 March

15

Step 15

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

18 March—18 March

16

Step 16

Слайдер.

19 March—19 March

17

Step 17

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

20 March—20 March

18

Step 18

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

21 March—21 March

19

Step 19

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

22 March—22 March

20

Step 20

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

23 March—23 March

21

Step 21

Эффект Parallax.

24 March—24 March

22

Step 22

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

25 March—25 March

23

Step 23

Хостинг.

26 March—26 March

24

Step 24

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

27 March—27 March

25

Step 25

Формы.

28 March—28 March

26

Step 26

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

29 March—29 March

27

Step 27

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

30 March—30 March

28

Step 28

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

31 March—31 March

29

Step 29

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

01 April—01 April

30

Step 30

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

02 April—03 April

31

Step 31

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

04 April—05 April

32

Step 32

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

06 April—07 April

33

Step 33

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

08 April—30 April

34

Step 34

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

01 May—31 May

35

Step 35

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

01 June—30 June

36

Step 36

Поизучать JS.

01 August—26 October

37

Step 37

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

27 October—31 December

38

Step 38

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

01 January—26 January

39

Step 39

Пауза

26 January—17 March

40

Step 40

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

17 March—05 May

41

Step 41

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

05 May—31 May

42

Step 42

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

01 June—30 June

43

Step 43

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

01 July—31 July

44

Step 44

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

01 August—31 August

45

Step 45

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

12 January—24 January

46

Step 46

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

19 January—01 March

47

Step 47

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

22 March—31 March

48

Step 48

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

31 March—11 April

49

Step 49

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

01 April—30 April

50

Step 50

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

01 September—30 June

51

Step 51

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

52

Step 52

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

09 June—26 June

53

Step 53

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

01 July—01 August

1

Step 1

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

23 February—23 February

2

Step 2

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

24 February—25 February

3

Step 3

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

26 February—28 February

4

Step 4

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

01 March—02 March

5

Step 5

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

03 March—04 March

6

Step 6

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

04 March—04 March

7

Step 7

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

05 March—09 March

8

Step 8

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

10 March—11 March

9

Step 9

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

11 March—12 March

10

Step 10

LESS.

13 March—13 March

11

Step 11

Сниппеты.

14 March—14 March

12

Step 12

GitHub.

15 March—15 March

13

Step 13

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

16 March—16 March

14

Step 14

Шрифты.

17 March—17 March

15

Step 15

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

18 March—18 March

16

Step 16

Слайдер.

19 March—19 March

17

Step 17

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

20 March—20 March

18

Step 18

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

21 March—21 March

19

Step 19

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

22 March—22 March

20

Step 20

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

23 March—23 March

21

Step 21

Эффект Parallax.

24 March—24 March

22

Step 22

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

25 March—25 March

23

Step 23

Хостинг.

26 March—26 March

24

Step 24

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

27 March—27 March

25

Step 25

Формы.

28 March—28 March

26

Step 26

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

29 March—29 March

27

Step 27

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

30 March—30 March

28

Step 28

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

31 March—31 March

29

Step 29

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

01 April—01 April

30

Step 30

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

02 April—03 April

31

Step 31

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

04 April—05 April

32

Step 32

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

06 April—07 April

33

Step 33

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

08 April—30 April

34

Step 34

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

01 May—31 May

35

Step 35

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

01 June—30 June

36

Step 36

Поизучать JS.

01 August—26 October

37

Step 37

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

27 October—31 December

38

Step 38

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

01 January—26 January

39

Step 39

Пауза

26 January—17 March

40

Step 40

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

17 March—05 May

41

Step 41

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

05 May—31 May

42

Step 42

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

01 June—30 June

43

Step 43

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

01 July—31 July

44

Step 44

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

01 August—31 August

45

Step 45

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

12 January—24 January

47

Step 47

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

22 March—31 March

48

Step 48

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

31 March—11 April

52

Step 52

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

09 June—26 June

53

Step 53

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

01 July—01 August

46

Step 46

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

19 January—01 March

49

Step 49

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

01 April—30 April

50

Step 50

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

01 September—30 June

51

Step 51

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

18 February 2019 31 December 2021
The goal is overdue by 1057 days
Details Briefly

Goal abandoned

The author does not write in the goal 3 years 3 months 21 days

Goal author

Fedor

Russia, Йошкар-Ола

22 years old

Send message

Add to friends

General

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

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

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

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

 Goal Accomplishment Criteria

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

 Personal resources

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

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

 Goal ecological compatibility

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

  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. Набивать портфолио и делать сниппеты(июнь)

    Шаблоны:

    Demand — https://w3layouts.com/demand-corporate-category-flat-bootstrap-responsive-website-template/

    OneSchool — https://themewagon.com/themes/free-bootstrap-4-html5-educational-website-template-oneschool/

    NewBiz — https://bootstrapmade.com/demo/NewBiz/

    Mechanized — https://w3layouts.com/mechanized-an-industrial-category-bootstrap-responsive-web-template/

    BizCraft — https://themefisher.com/products/bizcraft-multipurpose-business-template/

    Ecoland — https://technext.github.io/ecoland/index.html

    Knight — https://bootstrapmade.com/demo/themes/Knight/

    Educenter — http://demo.themefisher.com/educenter/

    1. Demand

    2. OneSchool

    3. NewBiz

    4. Mechanized

    5. BizCraft

    6. Ecoland

    7. Knight

    8. Educenter

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

    На этих ресурсах(преимущественно на первых 3):

    +Возможно, ещё каких-нибудь отсюда

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

  • 6475
  • 18 February 2019, 16:14

The goal is in the group

Веб-разработка

  • 1714

    members

  • 2434

    goals
Sign up

Signup

Уже зарегистрированы?
Quick sign-up through social networks.
Sign in

Sign in.
Allowed.

Not registered yet?
 
Log in through social networks
Forgot your password?
Settings

Widget for your goal

Big (450×150 px)

Small (250×100 px)

To insert a widget on your website or blog, copy the code and embed it in the original html-code to your blog/site.

For PRO only

You can buy a PRO account, or get it for free by inviting 3 friends to SmartProgress

Invite friends

Unlimited
number of goals

Buy PRO-account

Email for any cases

  • Maxim Malikov

    founder

  • Sergey Zakharov

    founder