개인코딩개발공장

휴대폰에서 사용자의 정보를 가져오는 기능을 개발하려는데 보통은 노트북으로 공부하니까 이게 테스트를 어떻게 해야할지 몰랐다 그래서 이번엔 휴대폰으로 테스트 하는 방법을 찾아봤다. 일단 내 컴퓨터의 ip주소를 알아봐야한다. 커맨드에 ipconfig를 쳐서 아이피를 따오자. 여기서 IPv4주소를 쓰면된다. 그리고 서버 실행하고 휴대폰으로 저 IPv4주소:포트번호 이렇게 접속하면된다. 중요한건 집인터넷으로 휴대폰 와이파이를 연결해야한다.

# 라우터 넘기기 app.get('/',(req,res,next)=>{ res.sendFile(path.join(__dirname,'/index.html')); if(false){ next('route') }else{ next() } },(req, res)=>{ res.send('라우터1') }) app.get('/',(req,res,next)=>{ res.send('라우터 2') console.log('라우터 2') }) 먼저 슬레시로 들어가면 if 조건이 true 이면 next('route')가 있다. 그럼 라우터 1로 연결되는게아니라 라우터 2가 연결된다. 다음라우터라는 뜻이 밑에 연결된 미들웨어가 아니라 '다음라우터'라는 뜻이다 만약 조건이 false면 라우터 1로 연결되겠지. 이걸로 로그인한사람..

const cookieParser = require('cookie-parser'); const session = require('cookie-parser'); const dotenv = require('dotenv'); 이렇게 모듈들을 가져왔다. app.use(express.json()); app.use(express.urlencoded({extended : false})); app.use(cookieParser(process.env.COOKIE_SECRET)); app.use(session({ resave:false, saveUninitialized : false, secret: process.env.COOKIE_SECRET, cookie : { httpOnly : true, secure : false..

app.use((req, res, next)=>{ console.log('all request') next(); }) 이전에 이게 미들웨어라했는데 정확히는 app.use안에 들어가있는 함수가 미들웨어다. app.use('/about', (req, res, next)=>{ console.log('어바웃') next(); }) 이렇게 about에서만 실행되게 할수도 있다. app.use((req, res, next)=>{ console.log('all request') next(); // next안하면 다음라우터 안넘어감.. 그래서 렉걸린거였네.. }, (req ,res, next)=>{ console.log('hi2'); next(); }, (req ,res, next)=>{ console.log('hi3..

express는 이미 사용해서 todoapp을 개발해봤기에 사실 아직까진 그닥 어렵지않은듯하다 라우터 분리와 로그인기능만 다시 좀 심도있게 보면 좋을듯 하다. 일단 시작하면서 원하는 폴더에 npm init을 치고 엔트리포인트만 설정한다. 그리고 npm install express 으로 모듈 깔아주고.. 암튼 이상태에서 server.js(엔트리포인트파일)로 nodemon 실행. const express = require('express'); const app = express(); const path = require('path') 기본모듈은 express 와 path가져왔다. app.listen(3000, ()=>{ console.log('서버 고고고') }); 3000포트에서 서버 실행 근데 여기서 a..

일단 아는것들은 생략하고 쓰도록 하겠다. #1 프로미스를 리턴하는 함수. 함수안에 들어있는 프로미스는 함수가 실행되면 바로 실행이 되어버린다. 먼저 코드 let promise = new Promise((resolve, reject)=>{ resolve('하잉'); }).then((data)=>{return data+'하이잉'}) .then((data)=>{return data+'gkdkdk'}) .catch(err=>console.log) function delay(ms) { return new Promise(resolve => setTimeout(resolve,ms)) } function hello(){ } 첫번쨰는 일반적인 프로미스.. 코드가 더럽더라도 양해바란다. 바로 쓴거라서.. 그리고 두번째는 ..

get요청이 사실 post요청보다 쉬운데 먼저 post를 다룬 이유는 post로 적은 데이터를 서버에서 처리해서 브라우저에 띄워주게 했기 떄문이다. 또한 json으로 내용을 가져왔기에 더욱 복잡해졌다. 먼저 front.js코드에 axios요청을 좀 다듬었다 document.getElementById("superForm").addEventListener("submit", async (e) => { e.preventDefault(); const message = e.target.superData.value; if (!message) { return alert('메세지를 입력하세요'); } try { await axios.post('/message', { message }); getMessages(); } c..

먼저 post요청이 무엇인지 대충 적어보면 클라이언트단에서 서버에 특정 데이터를 보내는 것이다. get요청은 서버에서 클라이언트에게 데이터를 보내는것이니 반대기능이다. 먼저 사용자가 보낼 데이터를 입력할 폼과인풋을 html에 만들어주자. 등록 그럼 브라우저에선 이렇게 보인다. 간단하게 걍 인풋에다가 뭘 적고 등록버튼을 누르면 보낼 수 있다. 여기서 중요한건 폼태그와 인풋에다가 id값을 정해줘야한다. 난 superForm, superData로 정해줬다. 여기선 버튼눌러도 설정해둔게 없어서 아무반응이 없다. #1 프론트 js에서 인풋데이터 받기 이제 front단 js파일을 손봐야한다. document.getElementById("superForm").addEventListener("submit", async..

사실 서버를 이해하면서 코드를보면서 대충 이해는 했지만 직접 작성을 하면서 익숙해지기는 어렵게 늦겨진다.. axios json등 개념부분은 이해가 되는데 직접 코드를 봐도 사실 이해가 잘 안됬따. 그래서 코드를 하나하나 차근차근 따봐야겠다는 생각이 들어서 이 포스트를 작성했다 그럼 자~ 시작! const http = require('http'); const fs = require('fs').promises; http.createServer(async (req,res)=>{ console.log(req.method) }) .listen(8080,()=>{ console.log('8080포트 연결') }) 먼저 req.method라는게 get, post등등은 있지만 method라는 객체는 뭔지 모르겠었는데 ..

const http = require('http'); http모듈을 가져왔다. const server = http.createServer(async (req, res)=>{ try { res.writeHead(200, {'Content-Type':'text/html; charset=utf-8'}) //html언어다라고 알려주는거.. 몇몇브라우저엔 알려줘야함. await fs.readFile('./http.html') .then((data)=>{ res.end(data) }) }catch (error){ console.log(error); res.writeHead(200, {'Content-Type':'text/plain; charset=utf-8'}) res.end(error.message) } }) ...