HTML? ?? HTML ??? ???? ??? ??? ?? ?? ??? ????. ???? ??? ??? ???? ? ????. ?? HTML? ???? ???? ?? ???? ?? ?? ?? ??? ??? ?? ????. ?? ??, ?? ???? ???, ?? ???? ?? ? ?? ? ?? ?? ?? ??? ??? ????.

 ...

   <src header.html> 

   ???

   <src footer.html> 

...</src></src>

?? ??? ??? ??? ????. ?? ?? ?? ?? ???.

????? ??? ??? ???? ?? ?? ??? ?? ????. ??? ?? ???? HTML ??????. CSS? ????? ?? ?? HTML? ???? ??? ?????????. ??? ??? ??? ?? ? ????? ??? ?? ?? ? ???? ???? ??? ??? ????.

php? ??????

?? PHP? ??? ? ?????

 ...

    php ?? "./header.html"?>

   ???

    php ?? "./fofer.html"?>

...

?? ?? ???? ??? ????? ??? ?? ??? ???? ??? ????? ????? ? ????? ?? ????.

Gulp? ??????

?? ??? ? ?? ?? ?????? ??? ????? ??? ? ??. Gulp???? ?? ? ??? ??? ????? ????. ??? Gulp-file-include???.

??? ??? ????.

 ...

   @@ include ( './ header.html')

   ???

   @@ include ( './ fumer.html')

...

??? ??? ??? ?? ? ???? :

 var fileInclude = require ( 'gulp-file-include'),
  gulp = ?? ( 'gulp');
 
gulp.task ( 'FileInclude', function () {
  gulp.src ([ 'index.html'])
    .pipe (fileInclude ({
      ??? : '@@',
      Basepath : '@file'
    }))
    .pipe (gulp.dest ( './'));
});

? ?? ?????? ??? ???? ??? ??? ?? ????? ??? ?? ?? ??? ?? ????.

Grunt? ??????

??? Grunt-Bake ??????? ????. HTML? ????? Grunt? ?????.

 grunt.initconfig ({
    ? : {
        your_target : {
            ?? : {
                "dist/index.html": "app/index.html",
            }
        }
    }
});

?? ?? HTML?? ?? ??? ??? ? ????.

 ...

   

   ???

   

...

?? ?? ??????

?? ??? ??? ????.

?? :

 handleBars.registerPartial ( 'myPartial', '{{name}}')

?? ?? ??????.

 {{> myPartial}}

?? ? ?? ???? ???? ?? ??? ????. Gulp-Handlebar? ?? ?? ????? ????? ?????.

?? ???? ???? ???? ?? ???… ???? ??? ????.

??? ??????

Pug? HTML? ?? ??? ??? ??? ?? HTML ? ??????. ??? ???? ????.

 ...
?
   ?? ./header.html "

   p ???

   ?? ./footer.html "

   ...

?? ?? Gulp Pug? ?? ??? ?????.

nunjucks? ??????

?? ??? nunjucks? ????! Nunjucks? ???? ????. ??? ??? ?? ? ???? :

 ...

   { % ?? "./header.html" %}

   ???

   { % ?? "./footer.html" %}

...

index.njk?? ??? ??? ??? ?? ????? index.html? ?? ? ? ??????.

 const nunjucks = require ( "nunjucks");
const fs = ?? ?? ( "FS");

fs.writefile ( "index.html", nunjucks.render ( "index.njk"), function (err, data) {
  if (err) console.log (err);
  Console.log ( "Nunjucks, Captain.");
});

?? gulp-nunjucks? ?? ??? ??????.

11ty?? Nunjucks? ???? ??? ???? ?? ? ?? ??? ??. ??? ?? ???? ???? ?? ????.

Ajax? ??????

??? ...

 
  
   
  
  ???.
  
  <futer> ???>

</futer>

? ???? ??? ?? ?? ??? ??? ??? ?? ? ????.

 fetch ( "./ header.html")
  . ??? (?? => {
    return response.text ()
  })
  . ??? (data => {
    document.querySelector ( "??"). innerHtml = data;
  });

fetch ( "./ footer.html")
  . ??? (?? => {
    return response.text ()
  })
  . ??? (data => {
    document.querySelector ( "???"). innerHtml = data;
  });

JavaScript? ?? ???… ?? ?? ??? JavaScript ??? ??? ???? ???? ???? ?? ?? ??? ?? ???? ?? ?? ???? ?? ??? ????? ??? ?? ?? ??? ??? ????. "./header.js"? ??? ?? ?? ??; ??? ? ??? ?? ????? ?????.

iframes? ??????

??? ??? ? ? ???? :

 
  
  <iframe src="./%20header.html"> </iframe>
  
  ???.
  
  <iframe src="./%20footer.html"> </iframe>
  

???? iframes? ??? ?? DOM? ???? ???? ???? ??? ??? ?? ?? ?? ???? (Iframes? ??? ??? ?? ??? ???).

Scott Jehl? ?? ????? ??????. Iframe ??? ?? ???? ??? ?? ? ?? ??? ?? ? ? ????.

 
  
  <iframe src="header.html" onload="this.fore
  
  ???.
  
  <iframe src = " booter.html this.contentdocument .children this.remove> </iframe>
  

Kolya Korruptis?? ??? ?? HTML ??? ??? ?? ?? ??? ? ?? ?? ??? ?? ? ? ????.

 <iframe src="contlod.html" onload="this.insertadjacenthtml ( 'afterend', (this.contentDocument.body || this.contentDocument) .innerhtml); this.remove ()"> </iframe>

Jekyll? ??????

Jekyllis ?? ?? ?? ??? ???? ??? ?????. ???/_includes/??? ???? ??? ?????.

 
  { % ?? header.html %}
  
  ???.

  { % ?? includ.html %}

Jekyll? ? ??? ??? ???? ??? ??? ???, ?? ??? ???? ??? ?? ???? ?? ? ??? ??? ???? ????.

Sergey? ??????

??, ?? ??? ??? ??? ??? ??? moressgbece? ?? ??? .Sergeyhas ? ?? ?? ??? ?? :

 
  <sergey-import src="%ED%97%A4%EB%8D%94"></sergey-import>

  ???.

  <sergey-import src="%EB%B0%94%EB%8B%A5%20%EA%B8%80"></sergey-import>

??? filesheader.htmlandfooter.htmland? ??/??/include/??? NPM ????? ??? ? ?? ? ??? ?? ??? ????.

Apache SSI? ??????

Cando? Super Duper Common Web Server ? Apache? ???? ????. ??? ???? ?????? :

 
		
  
  
  ???
  
  
  

??? ??? ????? ??? ??? ??? ?????. ?? ??? ??? ?? ?? ??? ???? ?? ?? ?????.

Apache ??? ??? ???? htaccess? ???? ??? ??? ??????.

 ??? ?????

AddType text/html .html
AddOutputFilter?? .html? ?????

?? ??? ???? ??? ??? ??? ????, ?????? ?? ???? ????? ?? ?? ?????.

Codekit? ??????

Mac ????? Codekit Hasa? HTML? ?? ? Citit Processes?? ??? ?? ?????. ??? HTML ??? ?????.

 ...

   

   ???

   

...

DreamWeaver? ??????

lol jk. ??? ??? ??? ?????.

??? ???

?? ?? ?????

?? ? ??? ????, HTML ??? ??? ?? ???? ???? ?? ?? ??? ????. ??? ?? ??? ???? ??? ????? ???? ?? ?? ??? ?? ?????? ????? ??? ???? ????? ????. ????? ?? ES6 ?? ??? ???? ?? ?? ?? ????? ???? ??? ??? ??? ????.@CSS ??? CSS? ?? ?? ?? ?? ?? ????? ???? ??? ??? ??? ????. ???? ?? ????? ?? JavaScript Bundlers? ES6 ?? ?? ??? ???? ?? ????? ?? ??? ??? ????.

? ??? HTML? ???? ?? ??? ???? ?????? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!