[TIL # 52] Node.js 찍먹하기 (1)

Yejin Yang·2022년 7월 15일
0

[TIL]

목록 보기
52/67
post-thumbnail
node

Node.js

Chrome V8 JavaScript 엔진으로 빌드 된 JavaScript 런타임
노드를 통해 다양한 자바스크립트 애플리케이션을 실행할 수 있으며, 서버를 실행하는 데 제일 많이 사용된다.

Node.js를 배워보고자 임의의 폴더를 생성한다

폴더명 markdowns 안에는 내가 포스팅할 블로그 글이 .md로 있다고 가정한다

const fs = require('fs')
const mdDir = `${__dirname}/markdowns`

const mds = fs.readdirSync(mdDir)
mds.forEach(file => {
  let md = fs.readFileSync(`${mdDir}/${file}`, { encoding: 'utf8' })
  console.log(md)
})

const fs = require('fs'):fs모듈은 파일 시스템에 접근하는 모듈이다. 즉, 파일을 생성하거나 삭제하고 읽거나 쓸 수 있다.

fs.readdirSync: 폴더의 내용을 읽을 수 있다.
fs.readFileSync: 파일의 내용을 읽을 수 있다.
encoding: 'utf8'로 인코딩을 설정하지 않으면 buffer(인코딩 전 데이터)로 출력된다.

콘솔로 찍어보면 마크다운 파일들의 내용이 터미널에 출력되는데
이걸 HTML로 변환하려고 한다.

Npm 패키지 Marked 사용해보기

마크다운 문법을 분석해주는 용도
npm 설치 후 marked.parse 로 분석하면 된다.

$ npm init -y
$ npm i marked
const fs = require('fs')

// marked 가져오기
const marked = require('marked');

const mdDir = `${__dirname}/markdowns`

const mds = fs.readdirSync(mdDir)
mds.forEach(file => {
 let md = fs.readFileSync(`${mdDir}/${file}`, { encoding: 'utf8' })

 // marked 사용
 const html = marked.parse(md)
 console.log(html)
})
$ npm index.js


마크다운 문법이 HTML로 변환 되었다.

HTML파일로 만들기

const fs = require('fs')
const marked = require('marked');
const mdDir = `${__dirname}/markdowns`

// 폴더 만들기
const htmlDir = `${__dirname}/html`
fs.mkdirSync(htmlDir)

// 예외 처리
// htmlDir 폴더가 존재하지 않을 때만 생성
if (!fs.existsSync(htmlDir)) {
 fs.mkdirSync(htmlDir)
}

const mds = fs.readdirSync(mdDir)
mds.forEach(file => {
 let md = fs.readFileSync(`${mdDir}/${file}`, { encoding: 'utf8' })
 const html = marked.parse(md)
 console.log(html)
 
 // 파일 확장자 변경
 const filename = file.replace('.md', '.html')
 fs.writeFileSync(`${htmlDir}/`)
})

fs.mkdirSync : 폴더를 생성한다.
fs.writeFileSync(경로, 데이터): 파일을 생성한다. 어떤 경로에 어떤 데이터로 파일을 만드는지 명시해준다.


nodemon 설치

코드를 수정할 때 마다 node index.js를 하는 것이 번거로울 때 활용한다.

$ node i nodemon
// package.json

  "scripts": {
    "start": "nodemon index.js"
  },
$ npm start

수정 될 때마다 자동으로 실행된다.

profile
Frontend developer

0개의 댓글