본문 바로가기

전체 글389

실시간으로 DB 데이터를 계속 가져오는법(SSE) 프로젝트를 진행하다 보면 실시간으로 DB 데이터를 가져와야하는 경우가 있다. ( 예를 들어 채팅같은 경우) 이런 경우 계속 DB에 GET 요청을 해도 되지만 이런 경우 서버에 과부화가 걸리게 된다. 따라서 우리는 서버와 유저간의 실시간 소통채널을 열어 데이터을 주고 받기를 해보려고한다. (server sent events) GET 요청할 부분 (프론트) 해당 코드는 어떤 UI가 클릭되었을 때와 같이 이벤트가 발생했을 때 작동되는 코드 내부에 넣어주면 된다. var eventSource; // get 요청하는 부분 (ajax get 하는 것과 비슷하다고 생각하면 된다) eventSource = new EventSource('경로'); eventSource.addEventListener('서버에 쓴 데이터 .. 2023. 9. 15.
채팅 기능 만들어보기 (혼자 만들어본 버전) [순서도] // 채팅 버튼 클릭 시 작동 app.post('/createchat', function(request, response){ db.collection('chatroom').findOne({ title: request.body.title }, function (error, result) { if (error) return error if (!result) { console.log('채팅방찾음x'); request.body.member.push(request.user._id.toString()); //채팅에 참여한 멤버로 현 로그인한 사용자를 넣었음. db.collection('chatroom').insertOne(request.body, function (error, result) { if (!.. 2023. 9. 13.
이미지 업로드 해보기 1. 이미지를 업로드하는 페이지 만들기 업로드 페이지 전송 해당 코드의 form을 보면 enctype이라고 우리가 이전에 보지 못한 속성이 있다. 이 속성은 뭘까? enctype이란? 폼 데이터(form data)가 서버로 제출될 때 해당 데이터가 인코딩되는 방법을 명시해주는 속성이다. enctype에 설정할 수 있는 아래 3개의 항목이 있다 application/x-www-form-urlencoded : 기본값으로, 모든 문자들은 서버로 보내기 전에 인코딩됨을 명시함. multipart/form-data : 모든 문자를 인코딩하지 않음을 명시함. / 파일이나 이미지를 서버로 전송할 때 주로 사용함. text/plain : 공백 문자(space)는 "+" 기호로 변환하지만, 나머지 문자는 모두 인코딩되지.. 2023. 9. 11.
라우터 폴더와 파일 만들어서 API 관리하기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 지금까지 만들었던 app.get~~ app.post~~ 이런 친구들을 라우터라고 하는데 server.js에 이 친구들이 너무 많기 때문에 용도에 따라서 파일을 분리해서 관리해보려고한다. 1. routes 폴더와 분리할 API의 파일 만들기 이번에는 연습용으로 아래의 API를 분리시켜보려고한다. app.get('/shop/shirts', function (요청, 응답) { 응답.send('셔츠 파는 페이지입니다.'); }); app.get('/shop/pants', function (요청, 응답) { 응답.send('바지 파는 페이지입니다.'); }); 2. 라우터 변수 만들기 라우터를 관리할 수 있도록 도움을 주는 함수를 이용해서 라우터 변수.. 2023. 9. 10.
회원 기능을 포함한 TODOLIST 사이트 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 현재까지 만들어온 ToDoList 사이트는 누구든지 글을 삭제하고 수정할 수 있었다. 이번 글에서는 해당 글을 작성한 사람만 해당글을 삭제 또는 수정할 수 있는 회원기능을 포함한 사이트를 만들어 보겠다. 1. 작성한 글에 작성자의 고유 ID 담아서 DB에 저장하기 현재까지 작성된 코드는 게시물의 번호와 제목, 마감일만 DB에 보냈다. 해당 데이터로는 누가 글을 썼는지 알 수 없다. 그래서 이번에 글을 작성할 때는 위의 데이터 뿐만 아니라 로그인한 사용자의 _id까지 DB에 보내보자. 그러면 사용자의 _id는 어떻게 가져올까? 이 글에서 우리는 request.user에 대해서 배웠다. 해당 데이터는 로그인한 유저의 모든 정보를 담고 있는데 이 .. 2023. 9. 10.
검색기능 만들기(3) - Search Index 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. app.get('/search', (request, response) => { db.collection('post').find({ $text: {$search: request.query.value} }).toArray(function (error, result) { response.render('search.ejs', { keyword: result }) }); }) 이전에 만들었던 위의 코드는 한국어와 같이 조사가 많이 붙는 언어는 구분하기 못한다. 따라서 우리는 Search Index를 이용해서 탐색을 해야한다 . 1. 이전에 만들었던 Index 삭제하기 indexes로 들어가서 만들었던 index를 삭제한다. 2. Search Index.. 2023. 9. 9.
검색기능 만들기(2) - indexing 개념 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 만약 DB에 데이터가 1000만개 있을 때 데이터를 찾으면 어떻게 될까? 1000만개를 모두 탐색해야하기 때문에 굉장히 오랜시간 걸린다. 따라서 DB는 보통 Binary Search라는 것을 사용한다. Binary Search란? 기본적으로 내림차순(오름차순)으로 정렬된 데이터에서 사용되는 탐색방법이다. 1. 전체 데이터의 평균이 되는 값을 찾는다. 2. 찾는 값이 해당 평균 값보다 큰지 작은지를 확인한다. 3. 2번 결과에 해당 되는 데이터의 평균이 되는 값을 다시 찾는다. 4. 찾는 값이 해당 평균 값보다 큰지 작은지를 확인한다. 5. 값을 찾을 때 까지 위의 방식을 반복한다. 이제 Mongo DB에서 indexing 작업을 해보자. 1... 2023. 9. 8.
검색기능 만들기(1) - URL query string 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 1. 검색창 만들기 검색을 하려면 검색창이 있어야하기 떄문에 list.ejs 파일에 검색창 UI를 만들어보겠다. 상단에 아래 코드 삽입 검색 2. GET 요청으로 서버에게 데이터 보내기 서버로 데이터를 보낼 때는 POST 요청을 사용하면 된다. 하지만 GET 요청으로도 서버로 데이터를 보낼 수 있는데 그게 바로 query string을 통해서 데이터를 보내는 것이다. query string이란 쉽게 말해서 GET 요청시 URL 뒤에 데이터를 몰래 심어서 요청하는 것이다. 위의 URL과 같이 물음표 뒤에 데이터1 이름 = 데이터1 값 & 데이터2 이름 = 데이터2 값으로 이루어져있는 것이 query string이다. query string의 형.. 2023. 9. 8.
ENV 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. env란? environment variable이다. 즉, 환경변수이다. 쉽게 말하자면 추후 환경에 따라서 변경될 수 있는 변수를 말한다. 이러한 변수들은 전역변수처럼 한 파일내부에 변수로 저장해두고 그 변수를 사용하는 것이 좋다. [사용법] 1. 환경변수를 위한 라이브러리 설치 npm install dotenv 터미널에 입력하기 2. 환경변수가 있는 파일에 라이브러리를 등록한다. require('dotenv').config() 3. 환경변수가 있는 파일과 같은 경로에 .env파일을 만든다. 4. .env 파일에 환경변수를 작성한다. 환경변수는 키워드 없이 왼쪽에는 변수명, 오른쪽에는 값을 넣는다고 보면된다. 또한 변수명은 대문자로 표기해야한.. 2023. 9. 7.
회원가입 기능 만들기 - 회원가입 페이지 만들기 + 라우팅 + post 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 1. 회원가입 페이지 만들기 회원가입 아이디를 입력해주세요. 비밀번호를 입력해주세요. 비밀번호를 한번 더 입력해주세요. 비밀번호가 일치하지 않습니다. 닉네임 입력해주세요. 회원가입 완료하기 2. 회원가입 페이지 라우팅하기 app.get('/join', function(request, response){ response.render('join.ejs'); }) app.post('/join', function(request, response){ db.collection('login').insertOne({ id: request.body.id, pw: request.body.pw, nickname: request.body.nickname}, fun.. 2023. 9. 7.
로그인 기능 만들기 Session (3) - 마이페이지 기능 만들어보기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 1. 유저가 아이디를 로그인하면 서버에서 DB에 해당 id, pw가 있는지 확인한다. 2. 해당 id, pw가 있으면 DB에 세션데이터를 저장한다. 3. 유저 브라우저로 쿠키에 세션 아이디를 담아서 전달한다. 4. 마이페이지 같은 페이지로 이동 요청을 하면 쿠키로 세션 아이디를 DB로 담아서 보낸다. 5. DB에서는 해당 세션 아이디가 세션 데이터에 있는지 확인 후 마이페이지를 띄울지 말지를 응답한다. 이번에는 4, 5번 기능을 만들어보려고 한다. 1. 마이페이지 페이지 만들고 라우팅 시켜주기. ~의 마이페이지 입니다. //라우팅 app.get('/mypage', function(request, response){ response.render.. 2023. 9. 6.
로그인 기능 만들기 Session (2) - 아이디 비밀번호 DB와 비교하고 세션 만들어주기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 1. 유저가 아이디를 로그인하면 서버에서 DB에 해당 id, pw가 있는지 확인한다. 2. 해당 id, pw가 있으면 DB에 세션데이터를 저장한다. 3. 유저 브라우저로 쿠키에 세션 아이디를 담아서 전달한다. 4. 마이페이지 같은 페이지로 이동 요청을 하면 쿠키로 세션 아이디를 DB로 담아서 보낸다. 5. DB에서는 해당 세션 아이디가 세션 데이터에 있는지 확인 후 마이페이지를 띄울지 말지를 응답한다. 이번에는 1번 기능 심화와 2, 3번 기능을 만들어보려고 한다. 1. 아이디와 비밀번호가 DB에 있는 데이터와 맞는지 비교하기 passport.use(new LocalStrategy({ usernameField: 'id', passwordFie.. 2023. 9. 6.
로그인 기능 만들기 Session (1) - 로그인 페이지 만들기, 아이디 비밀번호 검사하기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 이전 글에서 Session으로 로그인하는 방식을 보면 아래와 같다. 1. 유저가 아이디를 로그인하면 서버에서 DB에 해당 id, pw가 있는지 확인한다. 2. 해당 id, pw가 있으면 DB에 세션데이터를 저장한다. 3. 유저 브라우저로 쿠키에 세션 아이디를 담아서 전달한다. 4. 마이페이지 같은 페이지로 이동 요청을 하면 쿠키로 세션 아이디를 DB로 담아서 보낸다. 5. DB에서는 해당 세션 아이디가 세션 데이터에 있는지 확인 후 마이페이지를 띄울지 말지를 응답한다. 이번에는 1번 기능과 로그인 페이지를 만들어보려고 한다. 우선 진행하기 전에 로그인 & 세션 생성을 서포트해줄 라이브러리를 설치해야한다. 0. passport 설치하기 npm .. 2023. 9. 6.
Open Authentication(OAuth) Open Authentication(OAuth)란? 다른 사이트의 프로필 정보를 가져와서 내 사이트에서 활용 및 접근 권한을 주는 것 1. 어떤 사람이 페이스북으로 로그인 버튼을 클릭했다고 쳐보자. 2. 페이스북에서는 server.js에게 해당 유저의 프로필 정보를 준다. 3. 해당 프로필 정보를 바탕으로 세션이나 토큰을 준다. 4. 유저가 마이페이지를 요청하면 서버는 토큰이나 세션을 검사 후 마이페이지 html을 전달한다. 장점 이용하려는 서비스마다 회원가입을 하지 않고 기존의 사용하던 타사의 정보를 이용해서 로그인을 진행할 수 있다. 타사의 정보를 통해 특정 사이트를 이용한다는 것은 매우 위험할 수 있으나 직접 타사의 아이디와 비밀번호를 입력하던 예전 방식보다 안전한 사용을 제공한다. 정보는 회원정보.. 2023. 9. 5.
JSON Web Token(JWT) Token이란? : 암호화된 긴 문자열 JSON Web Token(JWT)이란? 세션 데이터를 서버에 저장하지 않고 마이페이지를 열람할 수 있는 열쇠(토큰)을 사용자에게 주는 것 1. 유저가 로그인을 하면 서버에서 토큰을 브라우저에게 전송한다. 2. 토큰을 받은 브라우저는 토큰을 쿠키 또는 Local Storage에 저장한다. 3. 이후 마이페이지와 같은 로그인 후 사용할 수 있는 기능을 수행하려고 하면 요청과 함께 헤더에 토큰을 포함해서 보낸다. 4. 서버에서는 해당 토큰이 유효한지 검사를 하고 유효하면 마이페이지 html을 전달한다. 장점 데이터 위변조를 방지한다. 인증하기 위한 별도의 저장소가 없어도 된다 확장성이 우수하다 토큰 기반으로 다른 로그인 시스템에 접근 및 권한 공유가 가능하다.(쿠키와의.. 2023. 9. 5.
Session-based Authentication Cookie란? : 브라우저에 저장할 수 있는 긴 문자열 Session-based Authentication란? 사용자의 세션정보를 저장해서 로그인 기능을 구현하는 방법 1. 유저가 로그인을 하면 유저가 로그인했다는 정보를 서버에 저장하고 세션 아이디가 적힌 쿠키를 보낸다. 2. 이후 마이페이지와 같은 로그인 후 사용할 수 있는 기능을 수행하려고 하면 자동으로 세션 아이디가 적힌 쿠키를 몰래 서버에 보내게 된다. 서버에서는 이 세션 아이디가 서버에 저장되어 있는지 확인 후 결과에 따라서 마이페이지 html을 전달하지 말지 정한다. 장점 서버에서 클라이언트의 상태를 유지하고 있으므로, 사용자 로그인 여부 확인이 용이하고, 경우에 따라서 강제 로그아웃등의 제재를 가할 수 있다. 클라이언트가 임의로 정보를 변.. 2023. 9. 5.
글 수정기능 만들기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. [전체적인 흐름] 1. edit.ejs 만들기 2. 특정 게시물의 경로로 들어올 경우 해당 데이터를 가져와 edit.ejs에 바인딩 후 연결하기 ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ 3. PUT 요청하기 위해 method-override 라이브러리 설치하기 4. form으로 PUT 요청하기 5. 서버에서 /edit이라는 경로로 put이 오면 수정되는 로직 작성하기 1. edit.ejs 만들기 글 수정 페이지 오늘의 할일 날짜 수정하기 (1번) ... 우선 해당 코드를 해석하기 전 그냥 action="/edit" method="PUT"으로 하면 안되나? 라는 의문이 든다. 결론은 '안된다.' 왜나하면 method에는 GET 또는 P.. 2023. 9. 4.
html 조립식으로 만들기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 웹사이트를 만들다가 다른 페이지에서 같은 UI를 만들게 되는 경우가 생긴다. (예를 들면 nav) 이런 경우 해당 UI를 변경하려면 각각의 페이지에서 모두 변경해야하는 불편함이 생긴다. 따라서 이런 불편함을 해결하기 위해서는 ejs 특유의 문법을 이용해서 하나의 html 파일을 만들고 해당 html을 include 해주면 된다. 1. 새로운 html 파일만들기 공통적으로 쓰이는 UI 코드를 복사해서 새로운 html 파일을 만든다. 🚨 주의할 점 🚨 1. ejs 파일에서만 적용된다. 2. ejs 파일에서만 적용되므로 view 폴더 내부에 해당 파일이 있어야한다. Navbar Home (current) pet beauty todo 작성하기 tod.. 2023. 9. 3.
todo 목록 상세페이지만들고 이동시켜보기(detail/1) 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 당장 블로그를 쓰고 있는 티스토리만 봐도 iosoo.tistory/entry/글 제목으로 오고 있다. 이렇게 특정 url 뒤 특정 값을 변경하면 해당 페이지로 이동하는 즉, 상세 페이지로 이동하는 코드를 작성해보려고 한다. 1. 상세 페이지 만들기 우선 detail.ejs를 만들어 상세 페이지를 디자인 해보자. 이전에 만들었던 list.ejs에서 불필요한 부분은 제외하고 모두 복사해서 아래와 같은 코드를 구성했다. Navbar Home (current) pet beauty todo 작성하기 [상세 페이지] 할일 제목 : 마감일 : 2. sever 구성하기 server.js 로 돌아가서 server를 구성해보자. 한글로 우선적으로 먼저 만들어보.. 2023. 9. 3.
AJAX로 삭제 후 UI 변화시키기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 삭제버튼을 클릭하면 todolist 목록 중 삭제 버튼이 클릭된 셀이 없어져야한다. 그 방법으로는 아래의 2가지 방법이 있다. 새로 고침하기 요소 제거해주기 1. 새로 고침하기 location.reload(); //새로고침 코드 $('.delete').click(function(e){ $.ajax({ method: 'DELETE', url: '/delete', data: { _id: e.target.dataset.id} }).done(function (result) { location.reload(); //새로고침 console.log('delete complete!'); }).fail(function (error) { console.log(.. 2023. 9. 3.
AJAX로 삭제요청하기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 1. 삭제 버튼 만들기 - list.ejs 제목 : 마감일 : 삭제 //삭제 버튼 2. 삭제버튼 클릭 이벤트 리스너 만들기 - list.ejs $('.delete').click(function(){ }) 3. 이벤트 리스너 내부에 AJAX 사용해서 DELETE 요청 보내기 - list.ejs 💡 AJAX(Asynchronous JavaScript and XML)란? 빠르게 동작하는 동적인 웹 페이지를 만들기 위한 개발 기법의 하나이다. Ajax는 웹 페이지 전체를 다시 로딩하지 않고도, 웹 페이지의 일부분만을 갱신할 수 있다 즉, Ajax를 이용하면 백그라운드 영역에서 서버와 통신하여, 그 결과를 웹 페이지의 일부분에만 표시할 수 있다. Aj.. 2023. 9. 1.
게시물에 번호 부여하기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. MongoDB에 데이터를 저장할 때는 _id라는 값을 넣어줘야한다. 그렇지 않으면 이상한 값이 _id로 들어가버린다. 대부분 _id 값은 게시물의 개수에 따라서 부여(1번 게시물 id: 1 2번 게시물 id: 2 ...) 하는데 이렇게 하기 위해서는 하드코딩 또는 자동으로 1씩 증가해서 id를 부여해야한다. 다른 DB에는 자동으로 id 값을 증가시켜 추가해주는 Auto Increment라는 기능이 있지만 Mongo DB에는 해당 기능이 없기에 직접 만들어야한다. 그래서 우리가 할 방법을 간단하게 설명하면 아래와 같다. counter라는 Collection을 하나 만든다. counter에 totalPost라는 데이터를 저장한다. 누군가 post.. 2023. 8. 31.
HTML에 DB데이터 넣는 법(2) - DB데이터 읽기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. DB에서 데이터를 가져올 때 사용하는 코드는 아래와 같다. db.collection('post').find(); // post 콜렉션에 저장된 모든 데이터를 가져와주세요..! 데이터를 array에 담아서 가져오는 코드는 아래와 같다. db.collection('post').find().toArray(function(error, result){ console.log(result) }) 사용자가 /list라는 URL로 접속했을 때 DB 데이터를 list.ejs 파일에 보내고 싶다면? app.get('/list', function(request, response){ db.collection('post').find().toArray(function(.. 2023. 8. 30.
HTML에 DB데이터 넣는 법(1) - EJS 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. DB에 데이터를 저장하는 이유는 필요할 때 데이터를 쓰기 위해서이다. 따라서 DB의 데이터를 가져와서 HTML에 넣기 위해서는 EJS라는 렌더링 엔진을 사용해야한다. EJS란? 서버 데이터를 HTML에 쉽게 삽입할 수 있도록 도와주는 HTML 렌더링 엔진이다. EJS 사용하는 법 1. 터미널에 npm install ejs 2. server.js 상단에 코드 작성 app.set('view engine', 'ejs'); 3. EJS 파일 만들기 EJS파일은 HTML과 똑같이 만들어서 사용하면 된다. 다만 다른 점은 EJS의 특별한 문법을 통해서 데이터를 중간중간에 넣어 쓸 수 있다는 점이다. 🚨중요한 점! EJS 파일은 views라는 폴더 내부에.. 2023. 8. 30.
Database에 자료 저장하기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. var db; MongoClient.connect('mongodb+srv://admin:qwer1234@cluster0.7jxmrtt.mongodb.net/?retryWrites=true&w=majority', { useUnifiedTopology: true }, function (error, client) { if (error) {return console.log(error)}; db = client.db('todoapp'); //todoapp이라는 데이터베이스에 접속해주세요. db.collection('post').insertOne({ _id: 1, date: 2023.08.29, title: 노드노드}, function (error, r.. 2023. 8. 30.
Mongo DB 초기 셋팅하기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 1. 가입하기 (링크) 2. 가입 시 답변해야할 것들 답변하기 3. 무료 프랜 선택 + 지역을 서울로 설정해주기 4. Database Access - Add New Database User를 선택하여 DB 접속용 아이디/비번을 생성한다. 여기서 주의할 점은 Buit-in-Role에서 Atlas admin을 선택해주어야한다.!!! 5. Network Access 메뉴에서 IP를 추가하기 테스트이기 때문에 allow access from anywhere을 클릭한다. 6. Database / collection 만들기 7. DB 접속하는 URL 찾기 admin: 부분은 이전에 4번에서 만든 DataBase의 admin과 password를 입력해주어.. 2023. 8. 29.
폼에 입력한 데이터를 서버에 전송하는 법(POST) 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 준비물: 우선 부스트스트랩으로 ToDoList 폼을 만들어보자. 글 작성페이지 오늘의 할일 날짜 Submit STEP01 - form 태그 셋팅 [write.html] 오늘의 할일 날짜 Submit action="/add" method="POST" : /add 경로로 POST를 요청함. 위의 세팅과 더불어 각각의 input 태그 내부에는 name을 작성해주어야 body-parser로 정확한 데이터를 뽑아내서 사용할 수 있다. STEP02 - body-parser 설치 [server.js] const express = require('express') const app = express() //body parser 라이브러리 설치 const b.. 2023. 8. 24.
서버에서 HTML 파일전송해보기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 1. 누군가 / 라는 경로로 방문을 하면 아래의 함수를 작동해라 app.get('/', function(request, response){ }); 2. index.html라는 파일을 전송해라 app.get('/', function(request, response){ response.sendFile(__dirname + '/index.html'); }); 이렇게 하고 http://localhost:8080 해당 url을 방문하면 미리 만들어진 html 파일을 보여준다. [응용] 안녕하세요 홈페이지입니다. 펫 뷰티 2023. 8. 22.
control + c로 서버를 끄지 않고 실시간으로 서버에 적용하기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 이전 글을 보면 control + c로 서버를 껐다가 켜서 서버에 반영했다. 이번에는 라이브러리를 이용해서 서버를 껐다 켜서 반영시키지 않고 바로 반영해보자, 1. nodemon 설치 npm install -g nodemon // 위의 코드로 진행 시 오류가 발생하면 아래의 코드를 작성해보자. sudo npm install -g nodemon 2. nodemon 활성화 nodemon server.js 서버로 사용중인 js 파일을 nodemon 명령어 뒤에 작성해준다. 이렇게 하면 코드를 변경해도 새로고침만 하면 바로 변경된 코드가 적용된다. 2023. 8. 22.
내 서버에 GET 요청 처리하기 해당 글은 이전 글들의 작업을 이어서 진행되고 있는 글입니다. 1. 서버 열기 [server.js] const express = require('express'); //express 라이브러리를 첨부해주세요. const app = express(); //첨부한 라이브러리를 이용해서 객체를 만들어주세요. // 8080port에 서버를 연다. app.listen(8080, function(){ console.log('8080 포트에 입장하셨습니다.'); }); http://localhost:8080 2. get 요청하기 .get('경로', function(요청 내용, 응답할 방법){ //실행 코드 }) [server.js] // 누군가 /pet이라는 경로로 방문을 하면 pet관련 안내문을 띄워준다. app... 2023. 8. 21.