3 ноября 2013 в 21:16

Библиотека X.Scaffolding



Внимание! Обновил пакет в NuGet. Подробности в конце статьи.

С выходом Visual Studio 2013, ASP.NET MVC 5 и Entity Framework 6 возможности скаффолдинга встроенные в Visual Studio стали еще лучше. Однако до сих пор создавая новое веб-приложение приходится делать много действий, которые можно было бы автоматизировать.
Поэтому для себя и разработчиков с которыми я работаю был создан пакет X.Scaffolding позволяющий более продуктивно создавать веб-приложения. Именно на основе этого пакета у нас сейчас разрабатывается большинство новых веб-приложений для работы с данными.

Сегодня же я решил поделится этим проектом и с читателями Хабрахабра. Возможно кому-то он покажется интересным и поможет в его работе, а кто-то и сам захочет поучаствовать в его развитии.

Как известно, Visual Studio предоставляет огромное количество функций, которые позволяют автоматизировать рутинные операции и сосредоточится на основных задачах. Одной из таких удобных и достаточно востребованных функций является возможность генерации форм редактирования для сущностей базы данных. Появилась эта функция уже давно, но с релизом Visual Studio 2013 стала и интеграцией в базовый шаблон приложения фреймворка bootstrap стала на мой взгляд еще удобнее. Но как известно — пределу нет совершенства.

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

Кроме того, не все типы данных сейчас поддерживаются стандартными расширениями. Например сейчас во многих моих проектах очень часто используются возможности пакета для создания HTML-редактора, календаря и предпросмотра видео.

Расширения


Ключевую роль в библиотеке играет класс Extensions, содержащий методы-расширений для HtmlHelper):
  • HtmlEditorFor — отображает редактор HTML на основе CKEditor 4
  • DatePickerFor — отображает bootstrap-style календарь
  • FileUploadFor — отображает элемент для загрузки файла
  • ThumbnailFor — отображает bootstrap-style prview для изображения
  • TextEditorFor — отображает bootstrap-style редактор
  • MultilineTextEditorFor — отображает многострочный bootstrap-style редактор
  • EmailEditorFor — отображает bootstrap-style редактор, который имеет HTML5 тип email
  • VideoPlayerEditorFor — отображает плеер если в поле записан url для видео опубликованного в YouTube, или Vimeo


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

Структура пакета


После установки NuGet-пакета X.Scaffolding в Ваше веб-приложение добавятся такие элементы как:

  • Content\global.css — содержит основные стили для веб-приложения (за основу брался Modern UI)
  • Content\scaffolding.css — содержит стили для отдельных элементов управления генерируемых системой скаффолдинга ASP.NET MVC
  • Scripts\scaffolding.js — содержит общие для всего веб-приложения скрипты для инициализации подключаемых плагинов
  • Views\System\Login.cshtml — шаблон страницы авторизации
  • Views\_ViewStart.cshtml — страница для автоматического задания шаблона для всех представлений в проекте
  • favicon.ico — фирменная иконка

Модуль авторизации

Модуль авторизации выполнен на основе шаблона с сайта bootsnipp.com


Кроме файлов добавляемым непосредственно пакетом X.Scaffolding в проект также добавляются некоторые другие пакеты и связанные с ними файлы. Рассмотрим их более детально.

Подключаемые пакеты NuGet

  • X.CKEditor — WYSIWYG-редактор, для редактирования HTML (поскольку команда CKEditor еще не выпустила официальный NuGet пакет для 4 версии, то я сам решил это сделать)
  • chosen.jquery — плагин для оформления красивых и удобных выпадающих списков с поиском. Более подробно рассматривается в статье, которую написал alizar
  • Bootstrap Datepicker — плагин, который позволяет добавлять элементы выбора даты в стиле Bootstrap
  • Microsoft ASP.NET MVC 5 — поскольку библиотека в первую очередь рассчитана на расширение актуальной версии MVC, то была добавлена ссылка именно на эту версию
  • EntityFramework 6 — то же касается и Entity Framework
  • Windows Azure Storage — набор библиотек позволяющих удобнее работать с веб-приложениями размещенными в облаке
  • Bootstrap 3 — думаю не стоит представлять этот фреймворк, тем более что начиная с Visual Studio 2013 базовый проект создается с уже подключенным пакетом bootstrap
  • PagedList.Mvc — библиотека, которая позволяет с легкостью разбивать списки на «страницы». Кроме того, включает стили и код для реализации пейджинга в разметке шаблонов
  • Microsoft jQuery Unobtrusive Validation — пакет для «ненавязчивой» валидации. Более подробно про него можно почитать в статье которую написала Juty


Присоединяйтесь!




Все желающие могут как ознакомится с исходным кодом библиотеки, так и расширить ее возможности.
Исходные коды проекта доступны на GitHub.

NuGet

Установить пакет можно из репозитория NuGet: Install-Package xscaffolding

Disclaimer
Хочу сразу предупредить, что так как библиотека создавалась прежде всего для применения в собственных проектах, в ней может быть несколько моментов которые стоит учитывать при ее использовании:
  • сейчас библиотека рассчитана на то, что в проекте используется ASP.NET MVC 5 версии и Entiy Framework 6 версии
  • в веб-приложение при установке пакета добавляется фирменная favicon (обусловлено тем, что в большинстве своем установки пакета сейчас производятся для наших собственных проектов)
  • в веб-приложение при установке добавляется ссылка на пакет WindowsAzure.Storage, что может оказаться лишним для тех, кто не работает с Windows Azure


Впрочем, исходные коды библиотеки сейчас находятся открытом доступе. И кроме того, если будет достаточный интерес к библиотеке — я планирую создать пакет X.Scaffolding.Core, в котором не будет привязки к вышеупомянутым пакетам и будет отсутствовать favicon.


Update
Поскольку изначально пакет в NuGet содержал как библиотеку, так и стили оформления, то я решил разделить его на две части.
  • В X.Scaffolding.Core я перенес базовую функицональность (собственно библиотеку и зависимости для ASP.NET MVC 5, js-библиотек CKEditor, Bootstrap и прочее).
  • В X.Scaffolding добавлена зависимость от X.Scaffolding.Core, Entity Framework 6, Windows Azure Storage и оставлены стили оформления Modern UI.

Поэтому, если Вам не нужны лишние css стили в проекте, то вы можете использовать пакет X.Scaffolding.Core.
Андрей Губский @Ernado
карма
30,5
рейтинг 1,6
Эксперт в области разработки и облачных технологий
Похожие публикации
Самое читаемое Разработка

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

  • +1
    Спасибо. А в vs2010 можно использовать ваш пакет?
    • 0
      Честно говоря под 2010 не тестировал, но учитывая, что сейчас идет привязка к ASP.NET MVC 5 и Entity Framework 6 а судя по этой ссылке VS2010 не поддерживает .NET 4.5 — то на данный момент видимо нет.

      Впрочем в самом коде сейчас нет каких-либо серьезных ограничений для отказа от поддержки .NET 4.0, поэтому перенести проект под VS 2010 я думаю можно будет без особых проблем. Возможно, если будет достаточно свободного времени, сделаю специально версию под .NET 4.0
  • 0
    Хорошего DateTime пикера в природе не существует :(
    • +1
      А каким, на ваш взгляд, должен быть хороший DateTime picker?
      • +3
        Работать в пользовательском часовом поясе (а не UTC), уметь принимать и отдавать дату/время в UTC+Z.
        Ну и работать как с чистой датой (пикер даты), так и со временем (пикер даты + время).
  • 0
    Entity Framework 6 точно поддерживает, просто в VS2013RC стандартный Scaffolding говорил, что максимум 5-ая версия.
    • 0
      Если я не ошибаюсь, то последний проект перевели на Entity Framework 6 (DataModel файл был удален и сгенерирован по новому с выбором 6 версии) и скаффолдинг работал вполне корректно.
      Хотя конечно стоит проверить.
  • 0
    Хорошая библиотека. Как-то делал похожую, но более простую. В основном в нее входили расширения для HtmlHelper'а. А вы развили идею, за что отдельный респект.
    По некоторым моментам в коде есть «замечания», но это так придирки.
    Спасибо за работу.
    • 0
      Спасибо за хороший отзыв!
      Проект открыт, так что если у вас будет желание что-то подкорректировать, или добавить — буду благодарен за вклад!

Только зарегистрированные пользователи могут оставлять комментарии. Войдите, пожалуйста.