<생활코딩 - WEB - WEB2 - Node.js>
1. Node.js의 파일 읽기 기능
1 정보 시스템의 핵심적인 기능을 CRUD라고 한다. (Create, Read, Update, Delete)
2 이 수업에서는 node.js를 통해 파일을 읽는 방법과, 생성, 수정, 삭제를 하는 방법을 배울 예정이다.
3 읽는 방법 검색: nodejs file read / 혹은 node.js 공식 홈페이지에서 확인
4 검색 결과가 이해되지 않을 경우, 각종 수단과 방법을 가리지 않고 알아내어 내 것에 적용하면 된다.
5 실습을 위해 fileread.js, sample.txt 라는 파일에 내용을 입력했다.
6 runtime에서 cd nodejs를 입력하여 파일 위치를 변경해주었다.
7 그런데 node fileread.js라고 읽기 명령을 입력하니, 여러 숫자만이 나타났다.
8 에디터에 ‘utf8’을 입력하고 다시 한번 시도하니, 화면에 텍스트가 잘 나타났다. 2. APP 제작 - 파일을 이용해 본문 구현
1 data라는 디렉토리를 만들고, 각 1,2,3.html 파일에 있던 p 태그 안의 내용을
data 디렉토리 내에 링크 이름대로(HTML, CSS, JavaScript) 저장했다.
2 main.js 파일의 p 태그 내용을 ${description}으로 변경했다.
3 변수 template 윗부분에 fs.readFile(`data/${queryData.id}`,
‘utf8’, function(err, description){ 를 입력했다.
4 response.end(template); 코드코드 })를 입력해 내용을 닫아주었다.
5 짜잔- 웹 화면에서 html, css, javascript 링크를 누를 때마다,
각 이름에 맞는 내용이 아래 나타났다. 3. JavaScript-Boolean
<복습내용>
1 참과 거짓을 나타내는 연산자이다.
2 산술 연산자와는 다르다.
3 console.log(true); / console.log(false); 2개의 데이터 타입으로 표현할 수 있다.
4. Javascript-비교연산자
1 console.log(1==1); / console.log(1>2);
2 위 코드의 == / > 는 비교연산자로서 true 혹은 false를 나타내게 하는 코드이다.
3 *참고: ==는 “좌항과 우항이 같으냐”, ===는 “좌항과 우항이 정확하게 같으냐”
4 * =는 대입연산자이다.
5. JavaScript-제어문
1 반복문을 통해 까다로운 문제도 해결할 수 있다.
2* 최소한의 도구를 가지고 나의 문제를 해결하는 게 가치 있는 일이다.
공부만을 지속하다 보면 머리가 복잡해져서 결국 아무것도 할 수 없게 될 수도 있다.
6. JavaScript-조건문
1 if 조건문에서 true 값은 출력되고, false 값은 출력되지 않는다.
false 값일 땐 else 부분이 출력된다.
</복습내용>7. NodeJS-콘솔에서의 입력값
1 프로그램에 INPUT이 입력되면, 프로그램이 정보를 처리한 후 그 OUTPUT을 출력한다.
즉, 프로그램은 I/O로 이루어져 있다.
2 Parameter는 INPUT 정보의 형식으로 볼 수 있다.
3 Argument는 INPUT의 실제 입력 값으로 볼 수 있다.
4 이 수업에서는 조건문을 통해, 입력 값에 따라 다른 아웃풋을 출력하는 프로그램을 만들 예정이다.
5 첫째
1) 검색: nodejs console input parameters
2) 결과: var args = process.argv.slice(2);
3) runtime에 파일 위치를 알려준 후,
node conditional.js jean 이라고 입력하니,
3번째 줄에 jean이 나타났다.
이를 통해 입력 값이 세 번째 정보부터 주도록 되어있다는 것을 알 수 있다.
6 둘째
1) var args = process.argv;
console.log(args[2]);
다른 코드코드
if(args[2] === ‘1’)
2) 위와 같이 에디터에 입력하고, runtime에 node conditional.js 1을 입력하니
if 문이 참이 되어 C1 값이 나타났다.
3) runtime에 node conditional.js 2을 입력하니 if 문이 거짓이 되어 C2 값이 나타났다.
7 이런 작업을 통해 보다 확장성이 높은 프로그램을 만들 수 있게 되었다. 8. APP - Not found 오류 구현
1 console.log(url.parse(_url, true)); 를 통해
runtime에서 여러 정보를 확인할 수 있다고 하는데,
내 경우에는 정보가 나타나지 않았다.
분명 어떤 입력 값이 수업과 달랐을 터인데,
어느 부분인지 모르겠으니 답답한 마음이 든다.
2 localhost:3000 을 주소창에 입력했을 때 나타나는 창의 pathname은 슬래쉬 / 이다.
3 이에 아래와 같이 변수 구문을 입력하여, 슬래쉬 / 뒤에 정확하지 않은 주소가 오면
“Not found”라는 문구가 나타나도록 만들었다.
var pathname = url.parse(_url, true).pathname;
if(pathname === ‘/‘){
fs.readFile 내용내용
} else {
response.writeHead(404);
response.end('Not found'); }9. App - 홈페이지 구현
1 queryData.id 가 undefined 일 때,
if 문과 var 변수를 통해 title에 “Welcome”,
description에 “Hell, Node.js”가 나타나도록 입력했다.
그리고 var template 부분을 복사해 붙여 넣었다.
2 else를 통해 원래의 var template와 이어질 수 있게 설정했다.
3 그리고 가독성이 좋도록 객체끼리 모아주었다. - 여기까지 공부한 후, -
강의와 함께 실습하는 데 중점을 두고, 기록은 내 기억을 되새김질하는 데 의의를 두고 간단히 작성해야겠다.
제일 중요한 것은 실제로 해보는 것이니, 다른 것에 에너지를 낭비하지 말자.
물론 기록도 정말 중요한 작업이지만, 요즘처럼 한정된 에너지를 효율적으로 사용하기 위해서는 더 중요한 실습에 중심을 두는 것이 맞는 것 같다.
10.Javascript-반복문
<복습복습>
1 while 구문을 통해 실행을 반복하고,
var 구문을 통해 실행 횟수를 제한하는 반복문을 복습했다. 11. Javascript-배열
1 변수 구문을 통해 배열 내 아이템을 집어넣고,
그 아이템을 다양한 방법으로 추출하고 추가하는 방법을 복습했다.
</복습복습>12. Javascript-배열과 반복문
1 total 변수를 만들고 total과 배열 내 값을 모두 합하는 계산을 입력하여,
number 배열 안에 있는 숫자가 모두 더해진 값을 구할 수 있도록 했다. 13. Node.js에서 파일목록 알아내기
1 ol 태그의 글 목록이 수동이 아닌 자동으로 추가, 수정, 삭제될 수 있도록 설정해보자.
2 검색: nodejs file list in directory
3 나온 검색 결과를 에디터에 붙여 넣기 하고, 수업내용과 똑같이 수정했다.
맨 윗 행에 var testFolder = ‘./data’; 도 입력해주었다.
4 data 폴더에 있던 파일 이름이 runtime에서 배열 형식으로 나타났다.
5 즉, node.js는 특정 디렉토리에 있는 파일의 목록을 배열 형식으로 전달하는 약속을 갖고 있다.
우리는 반복문을 통해 그 배열을 정보로서 처리해서 아웃풋을 만들 수 있다. 14. App 제작-글목록 출력하기
1 목록 출력하기
1) 변수 구문(var title ~ template) 부분을 파일목록을 가져오는 코드로 감싸주자.
2) fs.readdir(./data’, function(error, filelist)) 와 console 을 입력하면,
data 디렉토리 내의 파일 이름이 배열 형식으로 나타난다.
3) ol 태그 부분에 ${list}를 입력한다.
4) var list = ‘<ul>’;
5) while 구문을 통해 filelist 수만큼 반복되도록 입력한다.
6) wihle 구문 행 아래에 list = list + ‘<li>${filelist[i]}</li>’; 입력
7) list = list + ‘’;
8) 짜잔- data 디렉토리 내의 파일 이름이 자동으로 리스트화 되어 화면에 출력됐다.
2 목록에 링크걸기
1) <li><a href=“/?id=${filelist[i]}”>${filelist[i]}</a></li> 입력
2) else 내에도 fs.readdir~~ 코드를 입력해준다.
3) 짜잔- 목록에 모두 올바르게 링크가 걸렸다.
4) 코드 가독성 좋게 정리하기.
5) data 목록에 다른 파일을 추가하면, 웹 화면에 자동으로 그 파일 이름(Nodejs)이 목록으로 나타난다.
그 목록에는 링크도 걸려있다. 링크를 클릭하면, 파일 내용이 웹 화면에 나타난다.
6) 너무너무 신기하다 !!! 
💡 Software Engineer - F.E