Введение в UIkit framework.Часть 1

Введение в UIkit framework

От автора: приветствую Вас дорогой друг. В данном уроке мы с Вами поговорим о UIkit framework, который значительно ускоряет разработку все возможных пользовательских интерфейсов, очень прост в изучении и обладает приличным функционалом.

скачать исходникискачать урок

Как следует из названия UIkit предназначен, повторюсь, для разработки пользовательских интерфейсов. С помощью него, за довольно короткое время, можно сформировать достаточно сложную веб-страницу и причем, все элементы, входящие в ее структуру, будут выдержаны в одном едином стиле, что порой очень важно.

Фреймворк относительно молодой, так как был выпущен в июле 2013 года компанией Yootheme и уже пользуется хорошей популярностью среди веб-разработчиков. Так же он обладает хорошим быстродействием и по своей структуре состоит из отдельных модулей, что значительно упрощает работу и настройку под себя.

Конечно же, так как это современный фреймворк, в нем поддерживается адаптивность, то есть Вы всегда сможете при необходимости реализовать адаптивный пользовательский интерфейс. Так как UIkit – это больше CSS фреймворк, то конечно же, в основном работать придется с определенными стандартными именами классов, но они выбраны так удачно, что запоминаются практически мгновенно и интуитивно понятны. Ну и последнее компоненты входящие в состав фреймворка, могут работать как отдельно, так и друг с другом, как бы в паре, то есть Вы всегда сможете комбинировать функционал отдельных компонентов.

Итак, официальный сайт фреймворка Вы найдете по следующей ссылке.

Введение в UIkit framework

Это англоязычный ресурс, на котором так же представлена официальная документация по библиотеке UIkit. Но на просторах интернета Вы можете найти и русскоязычный сайт, но я крайне не рекомендую его использовать, так как по сути это простой машинный перевод первого рассмотренного нами сайта и порой читая пояснение к тому или иному элементу фреймворка, вообще не понятно о чем идет речь.

Введение в UIkit framework

Конечно, функционал фреймворка просто огромен и в течении двух уроков мы ни как не успеем рассмотреть даже малую его часть. Однако мы постараемся с вами реализовать не сложный пользовательский интерфейс, благодаря которому Вы сможете оценить возможности, которые предлагает UIkit и возможно он Вас заинтересует к дальнейшему, более углубленному изучению. Так же в видео версии я буду активно работать с документацией и соответственно, Вы будете видеть, откуда берутся различные используемые классы и возможно это поможет Вам в будущем самостоятельном обучении.

В разделе “Get Started” приведена инструкция по установке фреймворка и продублирована ссылка для скачивания библиотеки.

Введение в UIkit framework

Кроме того в данном разделе присутствует ссылка на официальные uikit примеры, то есть разработчики привели несколько страниц созданных при помощи вышеуказанной библиотеки, то есть готовое практическое использование, хотя предлагаемые интерфейсы очень просты. То есть Вы всегда сможете открыть данные примеры и используя исходный код, рассмотреть принцип их создания.

Собственно на этом текстовая версия урока закончена, в видеоверсии мы с Вами выполним установку фреймворка и начнем создавать свой первый пользовательский интерфейс. При этом Вы:

узнаете как создавать горизонтальную навигационную панель;

научитесь работать с отступами;

узнаете как быстро создать различные иконки;

научитесь работать с ненумерованными списками;

узнаете как формируется выпадающие навигационные меню;

А так же в завершении данной части мы кратко познакомимся с механизмом формирования сеток и закрепим данное умение уже в продолжении этого урока.

На этом у меня все, жду Вас в видеоверсии данного урока. Всего Вам доброго и удачного кодирования!!!

Фреймворк Bootstrap - верстаем адаптивно, просто, быстро!

Получите видеокурс по основам Bootstrap

Получить

Метки:

Комментарии Вконтакте:

Комментарии Facebook:

Комментарии (4)

  1. Дмитрий

    Здравствуйте Виктор ! Скажите, а когда ждать второй урок ?

  2. Дмитрий

    Да…. И сколько вообще планируется частей ?

    • Виктор Гавриленко

      Вторая часть урока записана и скоро будет опубликована. Продолжение зависит от интереса нашей аудитории.

  3. Алексей

    Очень интересный материал, спасибо. Хотелось бы полноценный курс по фреймворку. С примером создания сайта, галереи, каталогом товаров с картинками. Адаптивность изображений.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Я не робот.

Spam Protection by WP-SpamFree