Статьи
Урок 15. Закомимся с Ajax, GET и POST. Отправляем форму с сайта на сервер.
Сегодня будем отправлять форму заявки на вступление в клуб с сайта на сервер и там обрабатывать. Разберемся, каким образом браузер может обмениваться данными с сервером. Что было на прошлом занятии? Что будет на этом уроке? На этом уроке мы: Если в процессе изучения что-то не понятно - не стесняйтесь спрашивать нас и других учеников в нашей открытой группе в телеграм: Для тех, кто только к нам присоединился, ссылка на все уроки: https://zen.yandex.ru/srmt22_webclasses И ссылка на самый первый урок: https://dzen...
Урок 14. Знакомимся с PHP, Docker, NginX. Обучение веб-программированию с нуля.
Сегодня познакомимся с языком PHP, веб-сервером NginX, и инструментом контейнеризации Docker. До этого мы занимались чистым FrontEnd - только видимая часть пользователю. Делали дизайн, верстали, поработали немного с Javascript. ...ну, не считая того урока, где мы настраивали сервер и выкладывали на него. Сейчас мы погрузимся в Backend - в то, что происходит под капотом нашего проекта - на сервере. Это недоступно пользователю и это является основой нашего проекта. Большая часть работы ведется именно здесь...
Как сделать SSH ключ на MAC OS
SSH ключ нужен для доступа к серверам и сервисам по ключу вместо логина-пароля. Так называемый беспарольный доступ по ключу. Выпускается 2 ключа: приватный (хранится у вас) и публичный (сохраняется не сервере, куда вы будете получать доступ) При авторизации на сервере будет использоваться не логин-пароль, а ключ. Генерация ключа Откройте Terminal Введите команду ssh-keygen -t rsa Далее вас запросят имя файла, в котором сохранить ключ. Можно ничего не вводить - просто нажмите Enter (файл будет называться...
Урок 13. Знакомимся с Javascript. Обучение веб-программированию.
Учимся делать веб-сайты с нуля до трудоустройства. Разбираемся, как делать дизайн и верстку. Сегодня познакомимся с Javascript. С его помощью сделаем, чтобы при клике на кнопку открывалось модальное окно и сделаем проверку корректности заполнения контактной формы. Для тех, кто хочет индивидуальное обучение с преподавателем и трудоустройство: пишите нам в телеграм: Что было на прошлом занятии? Мы научились делать модальное диалоговое окно с помощью html и css. Вот ссылка на архив с результатами прошлого урока: https://github...
Урок 12. Учимся верстать. Делаем диалоговое окно с помощью html и css. Обучение веб-программированию с нуля.
Учимся делать веб-сайты с нуля до трудоустройства. Разбираемся, как делать дизайн и верстку. Сегодня разберемся, как делать диалоговые окна, работать с кнопками и формами. Те, кто хочет индивидуальное обучение с преподавателем и быстрое гарантированное трудоустройство, пишите нам в телеграм: Что было на прошлом занятии? Мы научились делать адаптивную верстку. Сделали так, чтобы сайт работал везде. Вот ссылка на архив с результатами прошлого урока: https://github.com/madmaker/srmt-lsn11/archive/refs/tags/v1...
Урок 11. Верстка адаптивного сайта.
Учимся делать веб-сайты с нуля до трудоустройства. Разбираемся, как делать адаптивную верстку, чтобы сайт работал корректно на всех устройствах: телефон, планшет, ноутбук, большой экран. Что было на прошлом занятии? Мы завершили верстку дизайна и получили полностью рабочий код главной страницы. Вот ссылка на архив с результатами прошлого урока: https://github.com/madmaker/srmt22-lsn10/archive/refs/tags/v1.zip Скачайте себе этот архив, распакуйте и откройте в vsCode. На его основе мы будем делать этот урок...
Урок 10. Верстка дизайна сайта. Часть 2. Верстка с помощью GRID
Учимся делать веб-сайты с нуля до трудоустройства. Сегодня продолжаем верстать дизайн сайта. Что такое верстка? Это, по большому счету, превращение картинки дизайна или дизайна из конструктора в код. Это продолжение большого урока по верстке. Ссылка на предыдущий урок здесь (Нужно начинать с Урока 9. Урок 10 - это продолжение): Если в процессе изучения что-то не понятно - не стесняйтесь спрашивать нас и других учеников в нашей открытой группе в телеграм: Для тех, кто только к нам присоединился, ссылка...
Урок 9. Верстка дизайна сайта. Часть 1.
Учимся делать веб-сайты с нуля до трудоустройства. Сегодня учимся верстать дизайн сайта. Что такое верстка? Это, по большому счету, превращение картинки дизайна или дизайна из конструктора в код. Что было на прошлом уроке? На прошлом уроке мы создали красивый дизайн нашего сайта в специальном конструкторе. Что будет на этом уроке? На этом уроке мы этот дизайн превратим в качественную верстку - превратим в качественный код. Мы сегодня также изучим новую технологию: Sass. И познакомимся с новым сервисом иконок: Fontello...
Установка Sass на Windows
Пошаговая инструкция по установке Sass на Windows SASS - это расширение для CSS. Вкратце: он упрощает работу с каскадными таблицами стилей CSS. Официальный сайт о SASS на русском языке: Инструкция в рамках курса обучения веб-програмированию. В целом вся информация есть на официальном сайте в разделе установки. Для установки нам потребуется менеджер пакетов CHOCOLATEY. Установка менеджера пакетов CHOCOLATEY на Windows Ниже ссылка на инструкцию по установке на официальном сайте, но я в статье также все по пунктам распишу...
Установка Sass на Mac OS
Пошаговая инструкция по установке Sass на MAC OS SASS - это расширение для CSS. Вкратце: он упрощает работу с каскадными таблицами стилей CSS. Официальный сайт о SASS на русском языке: Инструкция в рамках курса обучения веб-програмированию. В целом вся информация есть на официальном сайте в разделе установки. Для установки нам потребуется менеджер пакетов Homebrew. Я предполагаю, что он у вас уже установлен. Если нет, то вот ссылка на инструкцию по установке: Далее запускаем Terminal. Вводим команду...
Урок 8. Делаем красивый дизайн сайта
Учимся делать веб-сайты с нуля до трудоустройства. Сегодня будем делать красивый дизайн сайта Напомню, что на прошлых занятиях мы познакомились с вами с HTML, CSS, серверами Linux, DNS, почтой, доменами, создали веб-страницу и опубликовали ее в интернете на своем сервере. Мы большие молодцы. Продолжим. Что было на прошлом уроке? На прошлом уроке мы настроили почту для домена и сделали почтовые ящики. Что будет на этом уроке? На этом уроке мы создадим красивый дизайн нашего сайта в специальном конструкторе...
Урок 7. Настраиваем почту для своего домена
Учим веб-разработке с нуля до трудоустройства. На этом уроке мы настроим почту для своего домена на серверах mail.ru Что было на прошлом уроке? На прошлом уроке мы зарегистрировали доменное имя, разобрались с DNS, настроили A-зону домена, чтобы домен указывал на наш сервер. Что будет на этом уроке? На этом уроке мы настроим почту для нашего домена и сделаем почтовые ящики вида ivan@mydomain.ru. Если в процессе изучения что-то не понятно - не стесняйтесь спрашивать нас и других учеников в нашей открытой...