본문 바로가기

JS

 (18)
passport-local PassportPassport는 Node.js 애플리케이션에서 인증을 쉽게 구현할 수 있도록 도와주는 미들웨어다양한 전략(strategy)을 통해 다양한 인증 방식(예: 로컬, OAuth, JWT 등)을 지원하는 것이 특징각 인증방식을 stragies라는 개별적인 모듈로 만듦stragies를 통해 local이나 google과 같은 인증방식을 구현할 수 있음여기서 passport-local은 가장 기본적인 인증 전략으로, 사용자 이름(username)과 비밀번호(password)를 사용한 인증을 처리 passport-localsession을 이용함 로컬 전략 (Local Strategy)passport-local 전략은 사용자 이름과 비밀번호를 사용해 로컬 인증을 수행데이터베이스에 저장된 사용자 정보를 비..
fetch API와 axios 비교 Fetch APIFetch API는 자바스크립트에서 HTTP 요청을 보내고 응답을 처리하는 방식으로, 기존의 XMLHttpRequest를 대체함Promise를 기반으로 하여 비동기 작업을 더 간결하게 처리 기본 사용방법fetch(url, options) .then(response => { if (!response.ok) { throw new Error('Network response was not ok'); } return response.json(); }) .then(data => { console.log(data); }) .catch(error => { console.error('There has been a problem with your fetch op..
번들러 번들러(Bundler)여러 개의 파일(자바스크립트, CSS, 이미지 등)을 하나의 파일 또는 여러 개의 파일로 합쳐서 제공하는 역할번들링을 통해 애플리케이션의 성능을 최적화하고, 관리가 용이한 코드를 배포가능번들러의 등장은 자바스크립트의 생태계가 매우매우 강력해지게 되는 계기 번들러의 필요성웹 애플리케이션은 일반적으로 여러 개의 자바스크립트 파일, CSS 파일, 이미지, 폰트 파일 등 다양한 리소스로 구성되는데 이 파일들이 분리된 상태로 서버에서 클라이언트(브라우저)로 전달될 경우 많은 문제점이 발생네트워크 요청 수 증가: 각 파일마다 별도의 HTTP 요청이 발생하므로 네트워크 부하가 증가하고, 페이지 로딩 속도가 느려짐파일 종속성 관리의 복잡성: 여러 파일이 서로 의존할 경우, 이들을 올바른 순서로 로..
commonJS와 ESModule CommonJSCommonJS는 Node.js 환경에서 주로 사용되는 모듈 시스템require 함수와 module.exports 또는 exports 객체를 사용하여 모듈을 가져오고 내보냄  module.exports.add = function(a, b) { return a + b;}----------------------------------------const add = function(a, b) { return a + b;}module.exports = { add };---------------------------------------// 사용시const math = require('./math');특징 동기적 로딩: 서버 사이드 환경(Node.js)에서 일반적으로 문제가 되지 않지만, 브라우..
Node.js Node.jsNode.js는 구글의 Chrome V8 JavaScript 엔진 위에서 빌드 된 JavaScript 런타임 환경보통 JavaScript는 브라우저에서 실행되지만, Node.js는 서버 환경에서도 JavaScript를 실행할 수 있도록 함 Chrome V8과 JIT (Just-In-Time)JavaScript의 성능 문제초기 JavaScript 엔진은 인터프리터 방식으로 코드를 실행했기 때문에 성능이 상대적으로 느렸음웹 애플리케이션이 점점 더 복잡해지면서 JavaScript의 성능 문제가 심각해짐이러한 성능 문제를 해결하기 위해 보다 빠르고 효율적인 JavaScript 엔진이 필요했음구글 크롬의 출시구글은 빠르고 효율적인 웹 브라우저를 개발하기 위해 2008년에 크롬을 출시함크롬의 성능을 높..
Event Event이벤트는 웹 페이지에서 발생하는 특정 행동이나 상태 변화를 의미함이벤트의 간단한 예시사용자가 버튼을 클릭하거나 키보드의 키를 누름페이지가 로드되는 순간이러한 이벤트는 브라우저에서 자동으로 감지되며, 개발자는 이러한 이벤트에 대응하여 원하는 동작을 실행할 수 있음 Event의 종류마우스 이벤트(Mouse Events)사용자가 마우스를 이용해 발생시키는 이벤트click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout키보드 이벤트(Keyboard Events)사용자가 키보드를 이용해 발생시키는 이벤트keydown, keyup, keypress폼 이벤트(Form Events)사용자가 폼을 제출하거나, 입력 필드를 변경하는 등의 폼과 관련된 ..
파일 입출력 fs를 활용한 I/O 처리const fs = require('fs');// 파일 읽기fs.readFile('example.txt', 'utf8', (err, data) => { if (err) { console.error(err); return; } console.log(data);});// 파일 쓰기const content = 'Hello, World!';fs.writeFile('example.txt', content, err => { if (err) { console.error(err); return; } console.log('File has been written');}); 파일 읽기 : readFile 혹은 readFileSync 사용파일 쓰기 : writeFil..
Worker Thread Worker Thread 동작 방식Worker Thread는 일반적으로 메인 스레드와 분리된 별도의 스레드에서 실행되는 작업을 의미함이 스레드는 백그라운드에서 긴 작업을 수행하여 메인 스레드의 응답성을 유지작업 요청: 메인 스레드가 작업을 생성하고 이를 Worker Thread에 전달작업 수행: Worker Thread는 전달받은 작업을 수행하고, 이 과정에서 메인 스레드는 다른 작업을 계속 수행 가능작업 완료 통보: Worker Thread가 작업을 완료하면 메인 스레드에 이를 통보하고, 결과를 반환이 과정에서 Worker Thread는 메인 스레드와 별도의 스택, 힙, 명령 포인터를 가지며, 이를 통해 작업을 독립적으로 수행할 수 있음 사용 방법// CommonJSconst { Worker } = r..

티스토리툴바