썸네일 [ PUG ] pug파일을 찾지 못하는 오류 해결 - 폴더 위치 가끔 아래와 같이 pug파일 ("home") 을 views에서 찾을 수 없다고 에러가 발생하는 경우가 있는데 이러한 오류가 나는 이유 중 하나는 views의 위치 때문이다. Error: Failed to lookup view "home" in views directory views의 위치는 process.cwd()/views로 설정되어 있고 이곳에서 pug파일을 찾는다. [ process.cwd()의 값은 서버가 시작되는 곳으로 package.json의 위치이다. ] 그런데 아래와 같이 views directory가 src 폴더 안에 있게 되면 위와 같은 오류가 발생하는 것이다. *package.json *src *views home.pug login.pug 이를 해결하기 위해서는 views의 위치를 p..
썸네일 [ PUG ] PUG 사용 및 여러 기능 ( iteration, inheritance, partials, mixins ) pug pug란 express 뷰 엔진으로 html을 좀 더 보기 좋게 사용할 수 있게 하는 템플릿 언어, express 뷰 엔진이다. 사용을 위해서는 아래의 명령어를 터미널에서 실행시켜줘야한다. npm i pug 그 이후엔 아래의 코드를 파일에 삽입해야 view engine이 pug로 설정된다. app.set("view engine","pug"); 그렇다면 우리가 알던 html코드와 pug코드의 차이점은 무엇일까? 평소 우리가 알던 html은 아래와 같이 작성하는데 Hello this is a html file pug를 사용한다면 아래와 같이 작성된다. 를 사용하지 않아도 되며 부모자식 관계는 들여 쓰기로 사용한다. body div h1 hello p this is a pugfile 물론 pug를 사용..
썸네일 [ Node JS ] Node.js개발환경 준비 - express, babel.js, nodemon, morgan 아래는 코딩을 하기 전에 편리하게 코딩을 하기 위해 하는 작업 + express 사용을 위한 준비이고 기본적으로 Node.Js가 깔려있어야 한다. node --version을 터미널에 입력해 다운이 되어있는지 확인해 보고 다운이 안되어있으면 https://nodejs.org/ko/download 여기에서 다운로드하면 된다. 1. package.json 파일 생성 = npm init를 터미널에 입력해준다 "main"은 대표 파일을 지정하는 것이고 "scripts"는 긴 명령어들을 간단하게 사용할 수 있도록 한다. 터미널에서 npm run test를 입력하면 7번 라인에 존재하는 명령어가 실행된다. 2. express install npm i express express를 추가하는 것으로 위의 명령어를 입력..
썸네일 [ HTML ] 공백 넣기(띄어쓰기), 줄 바꿈하는 법 html에 공백을 아~무리 많이 입력해도 결과는 공백 한 칸이다. 또한 엔터를 눌러도 줄 바꿈이 되지 않는데 그럴 때는 아래의 방법을 사용하면 된다. : Non-breaking Space로 줄 바꿈 없는 공백이란 뜻이다. 공백 1칸을 의미한다. 위의 코드처럼 공백을 여러 개 넣고 싶다면 여러 번 입력해 주면 된다. 그런데 2칸 3칸을 띄어 쓰고 싶으면 어떻게 해야 할까..? :공백 2칸 :공백 3칸 아래의 코드를 보면 위의 코드보다 1칸씩 공백이 더 존재하는 걸 볼 수 있다. or : 줄 바꿈 태그 이 태그는 self-closing tag여서 닫는 태그가 존재하지 않아 줄 바꾸고 싶은 부분에 추가해 주면 된다. 노래가사를 출력하는 걸 예로 해보자 html에 줄 바꿈 하여 코드를 작성하였으나 결과는 왼쪽과..