본문 바로가기

기타

 (30)
Vue&Express 연동하기 (2) Client 1. Client 파일을 열고 config/index.js 파일을 열어 proxyTable을 설정해준다. proxyTable: { '/api':{ target:'http://localhost:3000/api', changeOrigin: true, pathRewrite: { '^/api':'' } } }, 2. axios 모듈을 설치 : npm i axios 3. src/main.js 파일에 axios를 전역에서 사용할 수 있도록 코드를 추가해 준다. import axios from 'axios' Vue.prototype.$http = axios 4. components/IndexPage.vue파일을 만들고 코드를 작성해준다. (화면에 보여질 vue파일 만드는것!) 접속한 유저 아이디: {{ ..
vue&express 프로젝트 생성 + 연동까지 Vue 1. npm install -g @vue/cli vue-cli는 기본 vue 개발환경을 설정해주는 도구이다. 기본적인 vue 프로젝트 세팅을 해준다. 2. vue init webpack (project 이름) vue 프로젝트를 생성한다. 이름은 client로 해주었다. 3. client파일로 이동 -> npm run dev 위치를 client파일로 이동하고 npm run dev를 해서 실행시킨다!! 4. localhost:8080 접속 Express 1. npm install -g express-generator express-generator는 express의 project 구조를 쉽게 만들어주는 라이브러리 client파일에서 나와 express-generator를 설치해준다. 2. expres..
[ERROR] vue: command not found 환경변수 설정합시다 vue_cli를 쓰려니까 또 vue를 못찾는다ㅋㅋㅋㅋ 해결이 안돼서 몇달동안 무시하고 했는데 이제는 해결해야할듯.....ㅠㅠㅠㅠ 환경변수가 문제인거같은데 안된다. 아무래도 경로가 잘못된 듯 하다..... 위 사진처럼 폴더 경로 확인하고 C:\Users\samsung\AppData\Roming\npm\node_modules\vue-cli\bin 이 경로로 환경변수를 설정해준건데 ㅎㅎㅎ방금 이유를 찾았따,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,Roamin인데 Roming이라고 오타를 냈었네,,,,,,,,,, 바보인가아,,,,,,,,, C:\Users\samsung\AppData\Roaming\npm\node_modules\vue-cli\bin 이렇게 말고 %AppData%\npm\n..
Socket.io 시작하기 npm install --save socket.io 먼저 socket.io 모듈을 설치한다. 작성해준 package.json이다. socket.io와 더불어 express와 nodemon또한 모듈을 설치해주었다. io.on('connection',(socket)=>{ }); connection이 발생할 때 메소드 안의 핸들러를 실행한다. socket으로 연결된 페이지를 로드하면 connection이 발생하고, 페이지를 닫으면 disconnection이 실행돼 socket이 해제된다. 실행시켜주면 잘 연결되었다고 console.log로 찍어준 listen:3000이라는 로고가 뜬다! 이제 localhost:3000 을 열어주면 "연결됨!" 이라고 찍어준 console.log가 뜬다. 일단 아래에서 보인 코..
Http 통신 VS Socket 통신 네트워크를 통해 서버로부터 데이터를 가져오기 위한 통신 방식은 크게 http통신과 socket통신 2가지가 있다. 1. HTTP 통신 http 프로토콜은 Client에서 요청이 있을때 응답하여 데이터를 처리한 후 바로 연결을 끊는 방식이다. Client가 요청(Request)을 하는 경우에만 Server가 응답(response)하는 단방향 통신이다. 서버는 클라이언트로 요청을 보낼 수 없다. 이런 방식을 사용하는 이유는 서버의 부하를 줄여서 다른 접속을 원활하게 처리하기 위함이다. Client가 요청을 보내는 경우에만 Server가 응답하는 단방향 통신이다. Server로 부터 응답을 받은 후에는 연결이 바로 종료된다. 필요한 경우에만 Server로 요청을 보내는 상황에 사용하기 적합하다. 요청을 보내 ..
Error: listen EADDRINUSE :::3000 Error: listen EADDRINUSE :::3000 어제까지만해도 오류없이 잘 실행됐는데 오늘 서버를 실행시키니 오류가 떴다....ㅠㅡ 3000번 포트가 이미 사용중이라서 뜨는 에러라고한다. 찾아보니 nodemon을 사용하다보면 종종 서버충돌 현상이 발생한다고 한다! 해결하기 위해서는 3000번 포트를 사용하는 프로세스를 찾아 종료시켜주어야한다. 1. cmd창을 열어 netstat -ano 입력 netstat를 통해 포트를 사용중인 프로세스를 확인할 수 있다! 3000번 포트를 사용하고있는 PID는 30552 이다. 2. 작업관리자 -> 세부정보에서 해당 PID를 찾아 작업 끝내기 작업관리자에 가서 30552 PID를 찾아서 강제 종료 시켜준다. 이제 프로젝트를 다시 실행시켜보면 성공.....!!!

티스토리툴바