영최의 개발켈로그

위와 같이 같은 페이지 내에서 form 전송하는 방법은 '비동기 HTTP 통신'을 통해서 할 수 있다. (type=“submit”을 사용할 경우 다른 페이지로 이동하며 이때는 '동기 HTTP 통신'방법이다.) 1.비동기 HTTP통신이란? 가.동기 방식: 한번에 하나만 처리, 순차적 방식 (페이지를 이동해서 서버가 데이터 처리) 나.비동기 방식: 서버에 데이터를 보내고 응답을 기다리는 동안 다른 처리가 가능한 방식 예를 들면 메일함 화면에서 메일을 확인하는 동시에 새로운 메일을 받을 수 있음 폼의 데이터를 서버와 'dynamic'(일부 내용 실시간 변경)하게 송수신할 때 즉 동적 폼 전송 시 비동기 HTTP통신 방식을 사용함 2.JavaScript 비동기 HTTP통신 방법 세가지 가.Ajax: JQuery..

1.form 가.form이란 입력된 데이터를 한번에 서버로 전송하기 위해 사용 즉, 클라이언트가 서버에게 정보를 전달할때 사용 나.속성 1)action: 폼을 전송할 서버주소 지정 .. //app.js app.post("/postForm", (req, res) => { console.log(req.body); res.render("result", { title: "POST 요청 폼 결과 확인하기", id: req.body.id, password: req.body.pw, }); }); 2)name: 폼을 식별하기 위한 이름, 반드시 지정 ... const form = document.forms["login1"]; 3)target: action 속성값에 지정한 스크립트파일을 다른 위치에서 열게 함 4)met..

1. 프로젝트 생성 가. npm으로 프로젝트 시작 및 express, ejs 설치 1) npm이란? Node Packaged Manager의 약자로 Node.js로 만들어진 pakage(module)을 관리해주는 툴 2) 설치 cd 프로젝트경로 npm init -y #프로젝트 시작 명령, -y 옵션: package.json 기본 값으로 생성 npm i express ejs # express ejs 설치 나. app.js 생성 1) app.js 생성 touch app.js 2) app.js 작성 const express = require("express"); const app = express(); const PORT = 8000; // 탬플릿과 탬플릿 엔진 설정 app.set("view engine", ..

1. print()문을 이용할 때, 따옴표등 특수문자를 출력하는 방법. 1) 따옴표 안에 전 후로 \ (Back slash) - \" or \' print('\"Hello World !\"') 2) ''' or """ print(''' "Hello World!" '''); 2. map의 결과를 다시 리스트로 변환해야함 li = map(int,input().split()) ori = [1,1,2,2,2,8] new = [ ori[i] - li[i] for i in range(len(li)) ] new = ' '.join(map(str,new)) print(new) - join 은 ('출력할 때 구분문자').join(리스트) 가 구조임 - map 한후 바로 출력하면 리스트가 아니라 오브젝트 값이므로 반드시 ..

1. async / await 방식 프로미스기반 코드를 좀 더 쓰기쉽고 읽기쉽게 하기 위해 등장했다. 비동기처리 패턴중 가장 최근에 나온 문법이다. 앞선 페이지에서 비동기를 처리하는 방법 중 3번째 방법이다. 2. promise 방식과 비교 기본 코드 function fetchFruits() { return new Promise((resolve, reject) => { setTimeout(() => { const fruits = ["🍎", "🍐", "🍋"]; resolve(fruits); reject(new Error("unknowm error")); }, 1000); }); } 1) promise .then(...).catch(...)방식 //promise then() 사용 시 fetchFruits()..

1. 비동기 방식이란 - 동기방식: '순차적'으로 동작하는 방식 요청을 보낸 후 응답을 받아야 다음 동작 실행 - 비동기 방식: '비'순차적 방식 요청을 보낸 후 응답에 관계없이 바로 다음 동작 실행 - 왜 비동기 방식을 써야하는가?: 동기 방식을 사용하면 서버가 언제 응답을 줄지 모르기때문에 계속 대기해야함 2. 비동기 '처리'가 필요한 이유 아래 코드를 돌려보자 function goMart() { console.log("마트에 가서 어떤 음료를 살지 고민! "); } function pickDrink(){ setTimeout(()=>{ console.log("고민 끝"); product = "제로콜라"; price = 2000; },1000) function pay(product, price){ co..

일단 모든 팀원들과 나 자신에게 수고했다고 말하고 싶다. 계속 밤을 샜는데도 시간이 너무 부족했던 것 같다. 프로젝트 설명 잘한 점 전반적인 디자인을 글꼴, 헤더, 메인화면 지도 등을 담당했었는데 정말 재밌어서 밤을 새는데도 그렇게 힘들지 않았다. 또한 미로찾기 부분에서 대각선으로 이동하는 문제를 해결하기 위해서 밤을 또 샜었는데 후천적으로 처리를 결국엔 해내서 성취감이 있었다. 근본 문제는 교민님이 해결하셨는데 그 과정에서 배우는 점이 많았다. 아쉬운 점 피드백 대로 차차 수정해나가야겠다.

1. 레퍼지토리에 업로드 먼저 이전에 실행시켰었던 node.js 관련 폴더를 깃에 새로운 레퍼지토리에 업로드 한다. //해당 폴더 이동 cd /code/BackEnd/20230317/trial //깃 올리기 git init git branch -M main git add . git commit -m 'backend' //깃 페이지에서 새로운 레퍼지토리 생성 및 아래 코드 복붙 git init git add README.md git commit -m "first commit" git branch -M main git remote add origin 레퍼지토리주소 git push -u origin main 2. ncp서버 이동 root@서버IP주소 이후 비밀번호 입력 3. ncp서버에 깃 클론 및 깃설정 g..