Server (6) 썸네일형 리스트형 Spring 서버에 배포하기 (Ubuntu, putty, maven) 난 maven 으로 프로젝트를 진행했다. application.properties에 다음을 추가해줬다. 모든곳에서 접속허용, 포트번호는 8000으로 했다. 서버의 acg 는 inbound규칙에 8000번포트 허용으로 해줬다. outbound: 1. putty 접속 후 패키지 설치sudo apt-get update# 패키지 정보 업데이트 (즉, 설치 가능한 리스트 업데이트)sudo apt-get upgrade# 패키지 버전 업그레이드 (update 로 가져온 리스트에 맞춰서 최신 버전으로 업그레이드) 2. 자바 OpenJDK 17 설치sudo apt-cache search openjdk# 설치 가능한 항목 검색sudo apt-get install openjdk-17-jdk# OpenJDK 17 - JDK.. nuxt.js 서버에 배포 (ubuntu, npm, putty) Ubuntu 환경 nuxt.config.js 파일 설정 프로젝트의 nuxt.config.js에 다음과 같이 추가해 줬다. server: { host: '0.0.0.0', // 모든 IP 주소에서 접근 가능 port: 3000 // 원하는 포트 번호 }, 서버의 acg에 3000번 포트, 433, 80 번 포트를 허용해줬다. 1. 서버 준비 및 업데이트 sudo apt-get updatesudo apt-get upgrade 2. NodeSource를 통해 최신 LTS 버전의 Node.js를 설치 curl -fsSL https://deb.nodesource.com/setup_lts.x | sudo -E bash -sudo apt install -y nodejs 3. Nuxt.js.. 공공데이터API(미세먼지) 활용하여 웹을 만들어보자②(react,node.js) 이제 서버페이지에서 공공데이터와 연결해보자 나의 서버페이지의 경로는 요래생겼다 왜이렇게했는지는 모른다 걍 익숙하다. body-parser, cors, express 모듈을 사용했다. const express = require('express'); //익스프레스 모듈 가져오기 const app = express(); const cors = require('cors'); //cors를 사용하고 싶다 const bodyParser = require('body-parser'); //body-parser을 사용하고 싶다 const port =5000; //서버포트는 5000번 포트 const route = require('./routes/index'); //router가 있는 곳이다 만들 index.js다 app.. [프로젝트]1:1 매칭 대상을 바꿔보자 (react,nodejs,express) 오늘 작업한거 정리이다 기존 이성 끼리만 매칭되던 기능을 버튼 하나 더 만들어 동성끼리도 만나게 해주자 콤보박스를 누르면 원래는 1:1과팅과 "다중매칭은 준비중입니다." 가 뜬다 저자리에 동성 친구를 넣어주자 버튼은 어떻게 구분 해 줄까 this.state = { arrow_text: "1 : 1 과팅", // 콤보박스에 뜨는 문구인데 default는 "1 : 1 과팅" count: 1, state 값에 count를 넣어서 1:1 과팅 클릭시 count: 1, 동성친구 클릭시 count: 2, 로 초기화 해준다 "매칭시작"을 누르면 컴포넌트가 실행 되는데 start 컴포넌트에 count값을 넘겨 주자, 그래야 구분지어 함수를 실행 할 수 있다 컴포넌트 당연히 props를 사용해야 한다 const user.. [프로젝트]채팅앱기본 React에서 Socket.io를 사용해보자(node.js) 채팅 앱 같이 실시간 연결 되어 소통이 일어 날 수 있게 해야한다 친구 영빈이가 가르쳐 줬다 복습 해보자 react 프레임워크에서 서버는 node.js 언어를 사용했다 우선 사용 할 모듈을 설치해 주자 npm install socket.io npm install socket.io-client 서버 사용 하기 위해 npm install body-parser npm install cors npm install express express, cors, bodyParser 모듈도 받아줬다 준비가 됐다 '클라이언트페이지1' 과 '클라이언트페이지2', 그리고 '서버페이지' 세개의 .js 파일을 만들 거다, 클라이언트는 라우터로 나눠주었다 "socket.emit 데이터 줄때" "socket.on 데이터 받을때" "s.. [프로젝트] id 중복확인 기능을 만들자 !!! ② (react) 앞서 말했던 server.js 와 index.js 파일을 만들어 보자 !! 우선 소스 경로는 이렇게 만들었다. 이유는 친구들이 이렇게 하길래 따라했다 참고로 src 폴더 바깥이다 const express = require('express'); //익스프레스 모듈 가져오기 const app = express(); const cors = require('cors'); //cors를 사용하고 싶다 const bodyParser = require('body-parser'); //body-parser을 사용하고 싶다 const port =3001; //서버포트는 3001번 포트 const route = require('./routes/index'); //router가 있는 곳이다 만들 index.js다 app.u.. 이전 1 다음