EJS 또는 Embedded Javascript Templating은 Node.js에서 사용되는 템플릿 엔진입니다. 템플릿 엔진은 최소한의 코드로 HTML 템플릿을 생성하는 데 도움이 됩니다. 또한 클라이언트 측 HTML 템플릿에 데이터를 주입하고 최종 HTML을 생성할 수 있습니다.
설치 단계
다음 명령을 사용하여 모듈을 설치합니다.
npm install ejs --save>
메모:
위 명령에서 npm은 모든 종속성이 저장되는 노드 패키지 관리자를 나타냅니다. 그만큼
–save 플래그는 Node 5.0.0 이후에는 더 이상 필요하지 않습니다. 이제 우리가 설치하는 모든 모듈이 종속 항목에 자동으로 추가되기 때문입니다.
시작하려면 다음을 설정해야 합니다. EJS 우리의 템플릿 엔진으로 표현하다 . Express는 단일 페이지, 다중 페이지 및 하이브리드 웹 애플리케이션을 구축하기 위해 설계된 Node.js 웹 애플리케이션 서버 프레임워크입니다. 표준 서버 프레임워크가 되었습니다. Node.js .
서버에서 전달된 데이터는 EJS 파일로 전송된 다음 아래 줄을 사용하여 해당 데이터에 액세스할 수 있으며 해당 데이터는 h, p 또는 다른 텍스트 태그에 제공됩니다.
>
if-else 및 루프나 기타 프로그래밍 문과 같은 일반적인 js 작업에 이 데이터를 사용하려면 다음 형식으로 작성할 수 있습니다.
Cricket Football>
이제 EJS 파일 또는 .js 파일의 스크립트 태그에 있는 해당 데이터에 액세스하려면 아래와 같이 해당 데이터를 다른 변수에 전달하기만 하면 됩니다.
let data = ''>
이제 EJS가 전달한 데이터 변수와 동일한 값을 가진 데이터 변수에 대해 모든 작업을 수행할 수 있습니다.
예: 우리 프로젝트에서 EJS를 사용하기 위한 구현입니다.
자바스크립트 // Filename - index.js // Set express as Node.js web application // server framework. // Install it using 'npm install express' command // and require like this: let express = require('express'); let app = express(); // Set EJS as templating engine app.set('view engine', 'ejs'); app.get('/', function(req, res) { res.render('home', {name:'Chris Martin'}); }); // Server setup app.listen(3000, function(req, res) { console.log('Connected on port:3000'); });> EJS의 기본 동작은 렌더링할 템플릿의 'views' 폴더를 조사하는 것입니다. 이제 메인 노드 프로젝트 폴더에 'views' 폴더를 만들고 노드 프로젝트에서 원하는 요청에 제공될 home.ejs라는 파일을 만들어 보겠습니다.
HTML 머리> 서버에서 전달된 EJS 변수의 텍스트는 = h2>입니다. <%=name%>h2>
스크립트 태그 = h2>에서 전달된 EJS 변수의 텍스트h2>
조작 후 스크립트 태그에서 전달된 EJS 변수의 텍스트 = h2>h2>