Как создать отзывчивый веб-сайт stati c для Azure с помощью Visual Studio 2017? - PullRequest
1 голос
/ 11 февраля 2020

Основным преимуществом веб-сайта * c, размещенного на Azure, является низкая стоимость (почти бесплатная) и бесплатный SSL.

Ссылка на это видео Скотта Хансельмана: A Stati c Сайт как можно дешевле с Azure Хранилищем

Используя вышеприведенное видео в качестве руководства, я уже разместил небольшую страницу Hello World (индекс. html) на Azure и отлично работает, и поставляется с бесплатным SSL. Мой маленький одностраничный веб-сайт в виде Azure блоба выглядит следующим образом:

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>Test</title>
</head>
<body>
    <h1>Hello World</h1>
</body>
</html>

Теперь мне нужно сделать небольшой (но реальный) сайт stati c для Azure, удовлетворяющий этим 3 требованиям :

  1. Несколько страниц
  2. Простой способ навигации между страницами, возможно, с помощью вкладок.
  3. Отзывчивый на рабочий стол / планшет / мобильный телефон

Мой вопрос такой:
Используя Visual Studio 2017, какой тип проекта я создаю, что позволит мне удовлетворить эти три требования в самый простой способ?

Любые мысли будут оценены. Для пояснения: веб-сайт stati c не использует ни базы данных, ни серверный код.

1 Ответ

1 голос
/ 11 февраля 2020

Самый простой способ, который я могу себе представить, - это создать проект MVC через Visual Studio.

MVC - отличный шаблон, обеспечивающий разделение логик c на модели, представления и контроллеры.

Учебник по настройке среды MVC можно найти здесь :

Она удовлетворяет вашим первым двум требованиям:

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

Во-вторых, реализовать навигацию также довольно просто. Пример этого можно найти в этой записи :

Для вашего последнего требования Я рекомендую создавать ваши представления с помощью Bootstrap, который является набором инструментов с открытым исходным кодом для HTML, CSS и JavaScript. Это облегчает создание реактивных веб-сайтов и может быть легко включено в ваш проект MVC. Учебник по реализации Bootstrap в MVC проекте можно найти здесь

Отличное руководство по созданию адаптивного веб-сайта с bootstrap можно найти здесь

...