[Express.js] 페이지 생성

 

https://opentutorials.org/course/3370

생활코딩님의 Express.js강의를 참고하였습니다.

---

1.페이지 생성페이지

페이지 생성인 /create 경로로 GET요청을 받았을때 폼을 보여준다.

// '/create' 경로에 대한 GET 요청을 처리하여 새로운 페이지를 생성할 폼을 반환합니다.
app.get('/create', function(request, response){
  // './data' 디렉토리의 파일 목록을 읽어옵니다.
  fs.readdir('./data', function(error, filelist){
    // 페이지 제목 설정
    var title = 'WEB - create';
    
    // 파일 목록을 HTML 리스트로 변환합니다.
    var list = template.list(filelist);
    
    // 페이지 생성 폼을 포함하는 전체 HTML 페이지를 생성합니다.
    var html = template.HTML(title, list, `
      <form action="/create_process" method="post">
        <p><input type="text" name="title" placeholder="title"></p> <!-- 제목 입력 필드 -->
        <p>
          <textarea name="description" placeholder="description"></textarea> <!-- 설명 입력 필드 -->
        </p>
        <p>
          <input type="submit"> <!-- 제출 버튼 -->
        </p>
      </form>
    `, '');
    
    // 생성된 HTML을 클라이언트에 전송합니다.
    response.send(html);
  });
});

 

 

 

2.페이지 생성

/create_process로 POST요청을 받았을때 페이지를 생성하는 기능을 수행한다.

// '/create_process' 경로에 대한 POST 요청을 처리하여 새로운 페이지를 생성합니다.
app.post('/create_process', function(request, response){
  var body = '';
  
  // 요청 데이터가 수신될 때마다 body에 추가합니다.
  request.on('data', function(data){
    body = body + data;
  });
  
  // 모든 데이터가 수신된 후 호출됩니다.
  request.on('end', function(){
    // 요청 본문을 파싱하여 title과 description을 추출합니다.
    var post = qs.parse(body);
    var title = post.title;
    var description = post.description;
    
    // 제목과 설명을 사용하여 새로운 파일을 생성합니다.
    fs.writeFile(`data/${title}`, description, 'utf8', function(err){
      // 페이지 생성 후, 리다이렉트하여 생성된 페이지로 이동합니다.
      response.writeHead(302, {Location: `/?id=${title}`});
      response.end();
    });
  });
});