1
00:00:03,260 --> 00:00:09,800
Добро пожаловать в интерфейсный веб-интерфейс фреймворков и инструментов: Bootstrap 4.

2
00:00:09,800 --> 00:00:13,565
Я рад, что вы решили присоединиться к этому курсу, чтобы узнать

3
00:00:13,565 --> 00:00:18,265
о самом популярном интерфейсе Web UI Framework: Bootstrap.

4
00:00:18,265 --> 00:00:20,995
Мы рассмотрим различные аспекты Bootstrap.

5
00:00:20,995 --> 00:00:29,520
Через несколько примеров вы узнаете, выполняя упражнения в рамках этого курса.

6
00:00:29,520 --> 00:00:32,900
Давайте посмотрим на некоторые детали дальше.

7
00:00:32,970 --> 00:00:35,890
Прежде чем начать этот курс,

8
00:00:35,890 --> 00:00:38,760
пожалуйста, убедитесь, что у вас есть достаточный опыт,

9
00:00:38,760 --> 00:00:44,455
чтобы иметь возможность успешно пройти этот курс.

10
00:00:44,455 --> 00:00:48,920
Перед началом курса вы должны иметь хорошие знания HTML, CSS и JavaScript.

11
00:00:48,920 --> 00:00:54,225
С моей точки зрения, веб-дизайн и разработка состоит из двух аспектов:

12
00:00:54,225 --> 00:00:58,320
один - это дизайн веб-сайта и веб-страницы,

13
00:00:58,320 --> 00:01:04,610
второй - фактическое создание и развертывание самой веб-страницы.

14
00:01:04,610 --> 00:01:06,845
С точки зрения дизайна,

15
00:01:06,845 --> 00:01:13,625
я имею в виду дизайн пользовательского интерфейса и пользовательский опыт,

16
00:01:13,625 --> 00:01:16,815
визуальный дизайн, прототипирование,

17
00:01:16,815 --> 00:01:20,164
элементы цветов,

18
00:01:20,164 --> 00:01:23,815
графики и анимации, которые могут представлять интерес.

19
00:01:23,815 --> 00:01:29,645
В этой специализации мы не рассматриваем этот аспект веб-разработки.

20
00:01:29,645 --> 00:01:32,650
Вместо этого мы рассматриваем второй аспект,

21
00:01:32,650 --> 00:01:34,680
который заключается в разработке, создании

22
00:01:34,680 --> 00:01:40,825
и развертывании веб-сайтов и веб-страниц, используя технологии, такие как интерфейсные

23
00:01:40,825 --> 00:01:45,190
веб-интерфейсы, такие как Bootstrap,

24
00:01:45,190 --> 00:01:52,030
возможно, фреймворк JavaScript, такой как Angular или библиотека, как React

25
00:01:52,030 --> 00:01:55,700
и гибридные мобильные для проектирования

26
00:01:55,700 --> 00:02:00,950
мобильных приложений, а также разработки на стороне сервера с использованием Node,

27
00:02:00,950 --> 00:02:06,670
Express, MongoDB, основного стека более подробно.

28
00:02:06,670 --> 00:02:09,530
Если вы смотрите на специализацию,

29
00:02:09,530 --> 00:02:13,035
думая о дизайне сайта,

30
00:02:13,035 --> 00:02:16,260
то вы, возможно, захотите переосмыслить еще раз.

31
00:02:16,260 --> 00:02:19,360
Эта специализация сосредоточена

32
00:02:19,360 --> 00:02:25,115
на разработке и развертывании веб-сайтов и веб-страниц,

33
00:02:25,115 --> 00:02:31,065
чисто технических знаний по использованию HTML

34
00:02:31,065 --> 00:02:37,310
, CSS и Javascript навыков для реальной разработки веб-сайта.

35
00:02:37,310 --> 00:02:43,080
Вы также, вероятно, задаетесь вопросом о том, что подразумевается под полной веб-разработкой стека.

36
00:02:43,080 --> 00:02:48,385
Мы рассмотрим более подробную информацию о полной веб-разработке стека в следующем уроке.

37
00:02:48,385 --> 00:02:52,835
В частности, если вы смотрите на то, как этот курс

38
00:02:52,835 --> 00:02:57,665
позиционируется в общем контексте веб-разработки полного стека,

39
00:02:57,665 --> 00:03:02,790
в этом курсе мы имеем дело с разработкой интерфейса веб-интерфейса.

40
00:03:02,790 --> 00:03:07,565
В частности, пользовательский интерфейс Framework Bootstrap 4.

41
00:03:07,565 --> 00:03:10,245
Мы рассмотрим остальные аспекты

42
00:03:10,245 --> 00:03:15,845
полной веб-разработки стека в остальной части этой специализации.

43
00:03:15,845 --> 00:03:19,640
Этот курс подробно рассматривает Bootstrap.

44
00:03:19,640 --> 00:03:23,640
Мы также рассмотрим адаптивный веб-дизайн и как Bootstrap поддерживает

45
00:03:23,640 --> 00:03:27,750
адаптивный веб-дизайн через систему Bootstrap Grid.

46
00:03:27,750 --> 00:03:33,050
Мы рассмотрим компоненты на основе CSS и JavaScript в Bootstrap и как вы

47
00:03:33,050 --> 00:03:38,660
можете использовать их при создании вашего веб-сайта и ваших веб-страниц.

48
00:03:38,660 --> 00:03:45,200
По пути мы узнаем об этой веб-разработке, используя командную строку.

49
00:03:45,200 --> 00:03:48,570
Таким образом, мы изучим много веб-инструментов, которые

50
00:03:48,570 --> 00:03:52,635
основаны на командной строке и экосистеме Node.js.

51
00:03:52,635 --> 00:03:54,630
Мы кратко рассмотрим Git,

52
00:03:54,630 --> 00:04:03,355
добавим Node.js и рассмотрим инструменты на основе Noje.js, включая бегунов задач, таких как Grunt и Gulp.

53
00:04:03,355 --> 00:04:08,235
Этот курс, сам по себе, структурирован на полные модули.

54
00:04:08,235 --> 00:04:12,195
Каждый модуль примерно соответствует одной неделе работы.

55
00:04:12,195 --> 00:04:13,830
В первом модуле

56
00:04:13,830 --> 00:04:17,795
мы получим представление о полной веб-разработке стека,

57
00:04:17,795 --> 00:04:22,895
затем вы получите быстрое введение в Git и Node.js.

58
00:04:22,895 --> 00:04:29,450
Затем мы познакомим вас с Bootstrap, а затем просмотрим систему Bootstrap Grid.

59
00:04:29,450 --> 00:04:34,180
Это приведет вас к первому заданию в этом курсе.

60
00:04:34,180 --> 00:04:38,520
Второй модуль имеет дело с компонентами Bootstrap CSS.

61
00:04:38,520 --> 00:04:42,445
Мы рассмотрим дизайн навигационной панели Bootstrap

62
00:04:42,445 --> 00:04:46,875
и как мы можем использовать ее для поддержки навигации.

63
00:04:46,875 --> 00:04:51,565
Мы будем смотреть на ввод пользователя через

64
00:04:51,565 --> 00:04:58,649
кнопки и формы, затем мы посмотрим, как мы можем отображать контент с помощью таблиц и карт.

65
00:04:58,649 --> 00:05:06,340
Затем мы рассмотрим, как мы можем включить изображения и медиа в нашу веб-страницу, используя изображения

66
00:05:06,340 --> 00:05:08,590
, миниатюры и медиа-объекты.

67
00:05:08,590 --> 00:05:13,095
И, наконец, мы смотрим на то, как мы оповещаем пользователей с помощью тегов,

68
00:05:13,095 --> 00:05:14,680
предупреждений и индикаторов прогресса.

69
00:05:14,680 --> 00:05:19,615
Это должно привести тебя к твоему второму заданию.

70
00:05:19,615 --> 00:05:25,425
Третий модуль имеет дело с компонентами Bootstrap JavaScript.

71
00:05:25,425 --> 00:05:27,980
Мы посмотрим на картину,

72
00:05:27,980 --> 00:05:32,930
как работают компоненты Bootstrap JavaScript, мы рассмотрим вкладки,

73
00:05:32,930 --> 00:05:34,635
таблетки и вкладки навигации,

74
00:05:34,635 --> 00:05:40,874
затем мы посмотрим, как коллапс и аккордеон могут быть использованы для отображения и скрытия контента.

75
00:05:40,874 --> 00:05:43,730
И тогда мы рассмотрим использование всплывающих подсказок,

76
00:05:43,730 --> 00:05:48,610
popovers и modals, чтобы показать контент, который будет отображаться на вашей странице.

77
00:05:48,610 --> 00:05:52,230
А затем мы рассмотрим компонент карусели,

78
00:05:52,230 --> 00:05:58,235
который позволяет отображать скользящую информацию на вашей веб-странице.

79
00:05:58,235 --> 00:06:02,670
Это должно привести вас к третьему заданию в этом курсе.

80
00:06:02,670 --> 00:06:11,625
Последний модуль имеет дело с Bootstrap и jQuery и различными инструментами разработки.

81
00:06:11,625 --> 00:06:17,070
Мы, в частности, посмотрим, как Bootstrap и jQuery взаимодействуют и как вы можете

82
00:06:17,070 --> 00:06:23,535
написать код jQuery и JavaScript, чтобы управлять вашим компонентом Bootstrap JavaScript.

83
00:06:23,535 --> 00:06:28,230
Мы рассмотрим различные методы, которые поддерживаются компонентами Bootstrap JavaScript,

84
00:06:28,230 --> 00:06:31,510
которые могут быть использованы для написания

85
00:06:31,510 --> 00:06:35,735
кода JavaScript для управления поведением этих компонентов.

86
00:06:35,735 --> 00:06:44,509
Затем мы рассмотрим язык предварительной обработки CSS, как LESS и Sass.

87
00:06:44,509 --> 00:06:49,675
Затем, наконец, мы рассмотрим, как мы можем создавать и развертывать наш сайт

88
00:06:49,675 --> 00:06:57,345
с помощью сценариев NPM или бегунов задач, таких как Grunt и Gulp.

89
00:06:57,345 --> 00:07:03,485
Это должно привести вас к окончательному заданию в этом курсе.

90
00:07:03,485 --> 00:07:06,990
Я надеюсь, что вы будете иметь много удовольствия, делая

91
00:07:06,990 --> 00:07:12,920
различные части этого курса, а также наслаждаться упражнениями, которые вы

92
00:07:12,920 --> 00:07:16,850
столкнетесь на каждом этапе, которые позволят вам лучше

93
00:07:16,850 --> 00:07:23,430
понять различные аспекты веб-интерфейса Bootstrap.