Макет интернет магазина - IShop

Данный курс предназначен для быстрого ознакомления с фундаментальными знаниями HTML5, CSS, JavaScript, JQuery и Bootstrap, необходимыми для верстки функциональных HTML макетов, которые будут использованы при разработке полноценной системы с использованием других языков программирования (Java, C#, PHP, Python и т.д.)

Данный курс состоит из двух частей: в первой части рассматриваются основные возможности HTML5, CSS, JavaScript, JQuery и Bootstrap, а также основные правила верстки HTML макетов, а во второй части полученные теоретические знания применяются для создания макета интернет магазина IShop

В качестве редактора кода будет использован Sublime Text, в качестве основного браузера будет использован Google Chrome.

Основной целью данного курса является предоставить основные знания front-end разработки для back-end разработчиков на Java, C#, PHP, Python и т.д. используя шаблоны Bootstrap и основные возможности HTML, CSS, JavaScript. Таким образом курс больше ориентирован на программистов, чем на Web дизайнеров или HTML верстальщиков.

В данном курс не рассматривается создание сайта по PSD макету. Для получения данных знаний рекомендуем обратиться к другим источникам информации.

Основы JavaScript, JQuery, Bootstrap и верстки даны в минимальном объеме, необходимом для разработки макетов. Для более глубокого изучения рекомендуем обратиться к другим источникам информации.

Разработанный в рамках данного курса макет интернет магазина IShop будет использован в курсе по созданию полноценного web приложения с помощью технологий JEE: Web приложение - IShop

Чему вы научитесь

• Основным возможностям HTML и CSS;
• Использовать минимально необходимые знания для написания JavaScript кода;
• Создавать адаптивные сайты с помощью Bootstrap;
• Создавать HTML макеты с нуля;
• Писать чистый и понятный другому программисту код;
• Использовать инструменты браузера для разработки сайтов;
• Проверять макет на разных устройствах;
• А также повысите Ваши знания в HTML, CSS, JavaScript.

1. Краткие теоретические сведения

• Основы HTML 
• HTML теги 
• Основы CSS. Селекторы 
• CSS Свойства 
• Основы верстки 
• Bootstrap 
• Основы JavaScript 
• Основы JQuery 

2. Создание макета

• Структура HTML кода и отображение товаров 
• Реализация поиска и отображения категорий 
• Реализация заголовка и странички состояния корзины 
• Добавление продукта в корзину 
• Форма поиска и удаление продуктов из корзины 
• Финальный обзор макета и проверка всех требований