전체 글101 [NodeJS] http - 요청과 응답 서버는 클라이언트가 있기에 동작한다. 클라이언트에서 서버로 요청(request)을 보내고, 서버에서는 요청의 내용을 읽고 처리한 뒤 클라이언트에 응답(response)을 보낸다. 따라서 서버에는 요청을 받는 부분과 응답을 보내는 부분이 있어야 한다. 요청과 응답은 이벤트 방식이라고 생각하면 된다. 클라이언트로부터 요청이 왔을 때 어떤 작업을 수행할지 이벤트 리스너를 미리 등록해둬야 한다. 아래는 이벤트 리스너를 가진 노드 서버이다. const http = require('http'); http.createServer((req,res) => { //여기에 어떻게 응답할지 적어줍니다. }) http 서버가 있어야 웹 브라우저의 요청을 처리할 수 있으므로 http 모듈을 사용했다. http 모듈에는 creat.. 2023. 6. 30. [NodeJS] 자주 발생하는 에러들 node: command not found - 노드르르 설치했지만 이 에러가 발생하는 경우는 환경 변수가 제대로 설정되어 있지 않은 것입니다. 환경 변수에는 노드가 설치된 경로가 포함되어야 합니다. node 외의 다른 명령어 그 명령어를 수행할 수 있는 파일이 환경 변수에 들어 있어야 명령어를 콘솔에서 사용할 수 있습니다. ReferenceError: 모듈 is not defined - 모듈을 require 했는지 확인합니다. Error: Cannot find module 모듈명 - 해당 모듈을 불러오려 할 때 발생합니다. Error [ERR_MODULE_NOT_FOUND] - 존재하지 않는 모듈을 불러오려 할 때 발생합니다. Error: Can't set headers after they are sen.. 2023. 6. 29. [NodeJS] 예외 처리하기 예외란? - 처리하지 못한 에러 멀티 스레드 프로그램에서는 스레드 하나가 멈추면 그 일을 다른 스레드가 대신한다. 하지만 노드의 메인 스레드는 하나뿐이므로 그 하나를 소중히 보호해야 한다. 메인 스레드가 에러로 인해 멈춘다는 것은 스레드를 갖고 있는 프로세스가 멈춘다는 뜻이고, 전체 서버도 멈춘다는 뜻이다. 예외 처리 -> 에러 로그가 기록되더라도 작업은 계속 진행될 수 있도록 아래 예제는 프로세스가 멈추지 않도록 에러를 잡는 방법이다. 에러가 발생할 것 같은 부분을 try/catch 문으로 감싸면 된다. 프로세스가 멈추면 setInterval도 멈출 것이다. setInterval(()=>{ console.log('시작'); try{ throw new Error('에러 강제 발생') }catch(err).. 2023. 6. 29. [JS] 콜백함수 정리 콜백함수 - 정의 : 함수에 파라미터로 들어가는 함수 - 용도 : 순차적으로 실행하고 싶을 때 사용 document.querySelector('.button').addEventListener('click',function(){ "버튼 누르면 이 코드 실행해주세요~" }) 이벤트를 넣고 싶을 때 .addEventListener() 사용. addEventListener() 소괄호가 있으니까 함수임. addEventLstener('click', function() {} ) 파라미터로 함수를 사용함 -> 이것을 콜백함수라고 부름 + 다른데서 만든 함수도 콜백함수로 넣을 수 있음 document.querySelector('.button').addEventListener('click',function 함수명) fu.. 2023. 6. 29. [SpringBoot] Html 자체 폼 전달 -> Controller / 검색기능구현 action 속성이 없는 Html 폼은 현재 페이지에 대한 요청을 보낸다. 이 경우, 폼 데이터는 현재 페이지 URL의 일부로서 쿼리 매개변수로 전달된다. 따라서 `method="get" 을 사용하여 html 폼을 제출하고 폼 데이터를 쿼리 매개변수로 전송할 수 있다. `action` 속성이 없으면, 폼 데이터는 현재 페이지로 전송된다. 따라서, html 코드에서 `action` 속성이 없어도 폼 데이터는 현재 페이지로 전송되며, 컨트롤러의 경로에 대한 요청으로 처리된다 //...생략 위의 코드에서 `method="get"` 을 사용하면 폼 데이터가 HTTP GET 방식으로 전송되며, 폼이 속한 현재 페이지로 전송된다. 컨트롤러에서는 @RequestParam 어노테이션을 사용하여 URL 매개변수를 받을 .. 2023. 6. 28. [NodeJS] 모듈 만들기 노드는 코드를 모듈로 만들 수 있다는 점에서 브라우저의 자바스크립트와는 다르다. 모듈이란? - 특정한 기능을 하는 함수나 변수들의 집합 노드에서는 두 가지 형식의 모듈을 사용함 1. CommonJS 모듈 2. ECMAScript 모듈 CommonJS 모듈 알아보기 1. 모듈이 될 파일과 모듈을 불러와서 사용할 파일이 필요함 var.js junc.js index.js 같은 폴더에 만들기. var.js const odd = 'CJS 홀수입니다.' const even = 'CJS 짝수입니다.' module.exports = { // 이 코드로 모듈로 만들어서 보내고 쓸수 있는듯 odd, even } module.exports 에 변수들을 담은 객체를 대입함 -> 이제 이 파일은 모듈로서 가능 이제 var.js.. 2023. 6. 25. [NodeJS] REPL / JS파일 실행하기 REPL : Read 읽고 Eval 해석하고 Print 반환하고 Loop 종료할 때까지 반복한다. JS 파일 실행하기 아무 폴더(디렉토리) 안에 helloWorld.js 생성 function helloWorld(){ console.log('Hello World'); helloNode(); } function helloNode(){ console.log('Hello Node'); } helloWorld() 콘솔에서 node [자바스크립트 파일 경로] 로 실행 콘솔에서 REPL 로 들어가는 명령어가 node 이고, 노드를 통해 파일을 실행하는 명령어는 node[자바스크립트 파일 경로] 이다. 2023. 6. 24. [React] 슬라이드(React Slick) 사용 npx create-react-app react-slide-ex npm install react-slick npm install slick-carousel components 폴더에 MySlider.js 생성, css폴더에 MySlider.css, images 폴더 생성하기 MySlider.js 에 슬릭 라이브러리 임포트 해주고 사진도 불러오기 import '../css/MySlider.css'; import Slider from 'react-slick'; import 'slick-carousel/slick/slick.css'; import 'slick-carousel/slick/slick-theme.css'; import img1 from '../images/slide-images1.jfif' func.. 2023. 6. 24. [SpringBoot] 회원가입 insert html 에서 form과 input으로 뼈대 만들기 이메일 계정이 있으신가? 로그인 자바스크립트로 연결되는지 확인하기 const btnElements = document.getElementById('Btn') btnElements.addEventListener('click', function() { alert('클릭'); }); alert 확인되면 자바스립트로 백연결 시작하기 registerForm.onsubmit = e => { e.preventDefault(); const xhr = new XMLHttpRequest(); const formData = new FormData(); formData.append('email', registerForm['email'].value); xhr.open('POS.. 2023. 6. 20. 이전 1 ··· 6 7 8 9 10 11 12 다음 728x90