Как верстать много страничные сайты?

Question

[Daniil]

Всем добрый день. Возник вопрос как лучше всего сверстать многостраничный сайт. Чтобы при нажатии на navbar загружался другой html . Например нажимаем на Контакты и вместо главной страницы появляется страница с контактами но при этом footer и header остаётся. Есть вариант использовать React но не все компании разрешают использовать его . В интернете предлагают использовать gulp , php и т.п , но наверное должны быть подходы без использования всего этого. Если знаете подскажите пожалуйста.

Comments

[Антон Литвиненко]

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

Answer 1

[valgerofficial]

Pjax очень крутой плагин, позволяет обновлять страницы, но при этом сохранять какие то блоки на странице, без обновления.

Answer 2

[Алекс Глебов]

pug бери

Answer 3

[ThunderCat]

Пару строчек на jquery. Можете переписать в ваниллу, суть одна.

<div id="DivContent"></div>
<script src="jquery.js"></script> 
    <script> 
    $(function(){
      $("#DivContent").load("another_file.html"); 
    });
    </script>

С помощью нехитрых манипуляций с дата атрибутами и листенерами на линках меню, будет то что вы хотели.

Answer 4

[Сергей delphinpro]

Если ваша задача сверстать сайт, то какого хрена речь заходит об реакте и иже с ними? Просто верстаете несколько страниц. На выходе должны быть файл с чистым html. ВСЁ!
Вы можете облегчить себе работу, используя галп, и шаблонизаторы (gulp-twig, gulp-pug).

Answer 5

[Otrivin]

Если хочется экзотики, сверстайте на iframe.

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

Принцип здесь

Ну а так, или делите шаблон на сервере на
.php-файлы и инклудьте нужные части, или делайте то же самое на клиенте - способ на jquery был выше, или с библиотекой includehtml