일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- Grading Students
- Sock Merchant
- #nodejs#express
- alogrithim
- Migratory Birds
- Drawing Book
- Breaking the Records
- 짝수와 홀수
- Apple and Orange
- 알고리즘
- Between Two Sets
- hackerrank
- Algorithm
- algorithim
- Data Structure
- 프로그래머스
- javascirpt
- 자료구조
- Ellectronics Shop
- 자바스크립트
- 생활코딩
- 노드
- Birthday Chocolate
- Divisible Sum Pairs
- #nodejs#노드js
- Javascript
- Time Conversion
- A Very Big Sum
- nodejs
- git
- Today
- Total
목록Front-End (26)
ian의 개발일기장
1. 오리엔테이션만들어 볼 것글 작성, 저장, 조회(1,2) 라우팅 구조글 작성 : /topic/new글 저장,조회1 : /topic조회2 : /topic/nodejs 2. 라우팅app_file.js로 메인 파일을 만들자. 위와 같이 코드작성 후, 서버가연결되나 확인해보자. 이때, 전에 배운 nodemon app_file.js로 작동시키면, 서버를 껐다가 다시키는일을 반복하지 않아도 된다. 글을 작성할 라우터 /topic/new를 작성해주자. 글 작성을 위해서 템플릿 엔진을 사용 할 것이다.app.set을 통해, 템플릿 엔진 사용할 명령어를 입력해주고, 템플릿 파일이 있는 폴더를 '/views_file'로 지정해준후, views_file이라는 새폴더를 만들자. views_file 폴더에 new라는 템플릿..
1. Supervisor 왜 필요한가? 항상 nodejs에서 파일을 수정하면, Ctrl+C키를 눌러 서버를 종료 후, node+파일명으로 서버를 켜야 변경내역이 적용됬었다. Supervisor는 이러한 불편함을 해소하기 위해서 나온 패키지이다. 2. 설치방법 터미널에 입력한다. 3. 사용법 터미널에 supervisor + 파일명 을 입력하면 된다. 4. 비슷한 패키지 nodemon이라는 패키지가 있다. supervisor랑 기능은 동일하다. 설치방법 실행방법nodemon + 파일명 출처 - 생활코딩
1. POST 방식을 이용한 정보의 전달 GET method - GET is used to request data from a specified resource.GET method는 HTTP method이다. GET라는 단어 뜻처럼, 클라이언트의 요청에 따라 어플리케이션의 응답의 정보를 얻는 것이다. 클라이언트가 url을 통해, 정보를 얻는 것도 GET method 이다. POST method - POST is used to send data to a server to create/update a resource.POST method도 HTTP method이다. POST라는 단어 뜻처럼, 서버에 데이터를 http body에 담아서 전송하는 것이다. 예를들어, 로그인이나 게시판글들을 전송하는 것이다. 2...
1. 쿼리스트링이란? http://a.com/login 전체를 URL 이라고 한다. 그리고 위에 사진속에 빨간색으로 표시된걸 Path라고 한다. 우리는 라우터(Paht)에 따라서 다른결과를 보여주었다. URL에서 /topic 라우터 뒤에 id=숫자가 있는데 저것을 query string이라고 한다. 한개의 라우터에서 다른 결과들을 출력 할 수 있다. 2. Express의 query 객체 사용 query_string.js 파일을 만들고, 위와 같이 코드를 작성해보다. 그리고나서 서버를 키고, localhost.com:3000/topic으로 접속하자. 우리의 라우터로 접속을 하거나, 라우터에 query string을 입력해서 접속을 해도 결과는 똑같다. query string은 어떻게 사용하는 것인가?! u..
1. 정의 템플릿 엔진이란? html code를 최소화시키도록 도와주는 도구이다. 정적인 파일과 동적인 파일의 장단점을 결합시켰다. 클라이언트 측 브라우저는 HTML 템플릿, JSON / XML 데이터 및 템플릿 엔진 라이브러리를 서버에서 로드합니다. 템플릿 엔진은 클라이언트의 브라우저에서 템플릿과 데이터를 사용하여 최종 HTML을 생성합니다. 그러나 일부 HTML 템플릿은 데이터를 처리하고 서버 측에서 최종 HTML 페이지를 생성합니다. 2. 템플릿엔진(pug) 설치 및 사용 설치 터미널에서 템플릿 엔진 설치할 폴더로 들어간다. 그 다음 npm install pug --save 를 입력후 설치를 하면, package.json파일에 dependecies에 추가가 된다. 템플릿엔진 사용 9. templat..
1. 정적인 파일 복습 먼저 dynamic.js파일을 만들어서, 위와같은 코드를 작성한다. 그리고 pulic 폴더를 만들고, static.html을 만들어서 다음과 같은 코드를 작성하자. node dynamic.js를 통해 서버를 틀고, http://localhost:3000/static.html로 접속하면, 우리가 작성한 html파일이 뜬다. 이것이 지난번에 공부한 정적인 파일을 서비스하는 방법이다. 서버가 켜진상태에서 static.html파일을 변경하고, 다시 http://localhost:3000/static.html 접속해보면 변경된내역이 바로 적용된다. 2. 동적인 파일 아까 작성한 dyanmic.js 파일에 저코드를 추가한다. http://localhost:3000/dynamic 으로 접속해보..
1. 정의 공식문서에 나왔듯이, 정적 파일(Static files)이란 image, css, javascript 파일입니다. 서버에서는 정적파일을 제공하려면, express.static 메소드를 이용해야합니다. 2. 예제 먼저 예제폴더에 사진처럼 public 폴더를 생성하고, 그림파일을 넣자. 나는 ironman.jpg를 넣었다. 예제폴더에 static.js 파일을 만들고, 위코드를 입력해보자. 터미널에서 서버를 키면, listen의 callback funtion이 실행된다. 웹브라우저에서 localhost:3000/ironman.jpg로 접속하면, 이미지파일이 보인다. 이번에는 라우터를 추가해보자. 라우터를 추가하면, 이미지를 불러올수 있다. 3. 정리 express.static(폴더명)은 정적 파일(..
app.js 파일을 만들고, 위코드를 입력해보자. 터미널에서 node app.js 입력해서, node를 실행하면, 터미널창에 listen부분이 코드가 실행된다. 웹브라우저에서 localhost:3000에 들어가면, Hello homepage가 화면에 나올것이고, localhost:3000/login에 들어가면 Login please가 나온다. 코드가 어떤식으로 돌아가는지 공식문서를 통해서 공부해보자. require를 통해, express 모듈을 불러오고, express()를 실행하여 express application을 만든다. express 공식홈페이지를 들어가면, app이라는 application에 메소드들이 나온다. app.listen을 보면, 우리가 node.js에서 배운 http.Server.l..
1. 정의 express 공식홈페이지에 나온대로, express는 node.js의 프레임워크입니다. node.js로 웹서버를 구성할 때, 기능을 하나하나 다 짜면 코드가 길어지거나 귀찮아 지는것들이 있습니다. express를 사용하면 코드의 양도 줄여주고, node.js보다 더 간단하게 기능구현이 가능합니다. 2. 설치 공식문서에는 이렇게 설치를 소개하고 있다. app.js 파일을 만든후, 터미널에 node app.js를 입력해보자. express가 설치되지 않았을 경우, 저러한 오류가 뜬다. express 모듈을 설치하려면, 설치할 폴더로 들어가서, npm으로 설치를 한다. npm init으로 package.json을 생성 후, npm install 패키지명 --save를 이용하여, express 설치..
1. 정의 동기(Synchronous) - 줄여서 Sync 라고 하며, 일을 순차적으로 해결해나간다. 비동기(Asynchronous) - 줄여서 Async, 해야 할 일을 위임하고 기다린다. 2. 예제 동기와 비동기를 이해하기 위해서, nodejsd 내장모듈인 File System을 이용해보자. File System이라는 내장모듈에는 readFile 과 readFileSync 라는 메소드들이 있다. fs.readFileSync가 동기함수이고, fs.readFile은 비동기 함수이다. 공식문서를 보면, 사용법이 잘 나와있다. readFileSync는 첫번째 인자는 path, 두번째 인자는 option으로 encoding 객체를 넣을수 있고 생략가능하다. path에 있는 파일의 내용을 리턴하는 메소드이다. ..