웹49 (Node.js) pm2 서버 중단 없이 소스 반영법/무중단 서비스하기 (pm2사용법) Node.js 무중단 서비스 하기 * 생활코딩님의 강좌를 참고하여 복습겸 만든 포스팅입니다. 생활코딩님 강좌 바로보기: 링크 1. PM2란? production process manager for node.js 입니다. 즉, node.js를 통해서 만든 프로그램을 관리해주는프로그램입니다. 2. PM2를 사용하는 이유 > PM2를 사용하지 않을 경우, 에러가 발생하여 프로그램 동작이 중지 되는 경우가 있다. PM2를 사용할 경우, 프로그램 동작이 중지되면 PM2가 프로그램 동작을 다시 실행 시켜 준다. > PM2 사용시, 코드를 수정 할 때, 서버를 끄고 다시 시작하는 번거로움 없이, 코드를 저장하고 웹 새로고침만 해주면 수정사항이 반영된다. 3. PM2 설치 1) 프로젝트 파일 터미널 창에서 아래 코드 .. 2021. 9. 8. (Node.js) node.js express로 서버구축하기 (Node.js) node.js express로 서버구축하기 * Node를 설치한 후 실행하셔야 됩니다. 1. 프로젝트파일 열기 프로젝트 폴더를 visual studio Code 혹은 다른 코드편집기에서 열어줍니다. 2. 터미널창에서 아래 명령어를 입력해 줍니다.(사진 참고하세요~) > npm init > npm install express --save *npm init을 하고 계속 엔터를 쳐주시면 됩니다!! (마지막 "Is this OK?"까지 엔터를 치고 폴더쪽 새로고침을 해주면, package.json파일이 생겨남) 3. 서버구축 코드 > 파일 생성 후 코드 입력. 파일명: server.js const express = require("express"); const app = express(); /.. 2021. 9. 7. (Node.js) node.js 서버구축하기/node.js 서버 만들고 실행하기 node.js 서버구축 및 실행하기 * Node를 설치한 후 실행하셔야 됩니다. * Node.js express로 서버 실행법을 알고싶다면 포스팅 하단 링크를 참고해주세요 :) 파일명: server.js const http = require("http"); const app = http.createServer((request, response) => { const _url = request.url; const fullUrl = new URL("http://localhost:3000" + _url); const pathName = fullUrl.pathname; if (pathName === "/") { response.writeHead(200, { "Content-Type": "text/html;char.. 2021. 9. 6. (JavaScript) 자바스크립트 브라우저에 데이터 저장하기 - localStorage 사용법 및 예제 localStorage 사용법 및 예제 * 본 포스팅은 여러 참고 자료와 강의 수강 후 개인적인 복습을 위해 정리하였습니다. 참고 링크: 1. localStorage란? 2. localStorage 영문 자료 참고 강의: 1. 노마드코더: 초보자를 위한 바닐라자바스크립트 강의 포스팅 요약 1. localStorage로 만든 예제 결과 2. localStorage란? 3. localStorage사용법 4. 브라우저에서 localStorage 데이터 보는법 5. localStorage 예제 코드 1. localStorage로 만든 예제 결과 1) input 태그에 닉네임 입력 2) 새로고침 혹은 페이지를 나갔다가 들어와도 아래 이미지와 같이 데이터가 남아있음. 3) Remove 버튼 클릭시, 데이터가 삭제.. 2021. 8. 31. (React) Immer에 대해서/Immer 사용법 (React) Immer에 대해서/Immer 사용법 * 본 포스팅은 개인 공부를 위해 '리액트를 다루는 기술'을 읽은 후 정리한 내용입니다. 포스팅 요약 1. 불변성의 중요성 2. immer이란? 3. immer 사용법 4. immer 사용 예제 더보기 1)immer 사용 전 2)immer 사용 후 3)useState와 immer 함께 쓸 때 1. 불변성의 중요성 > 불변성이 지켜지지 않을 경우, 값이 새로워져도 바뀐 것을 감지 못함. > 바뀐것을 감지 못할 경우, React.memo에서 서로 비교하며 최적화하는 것 불가능. 2. immer이란? > 객체구조가 깊어질 경우, 간단하게 불변성을 유지하며 업데이트해 줄 수 있는 라이브러리 3. immer 사용법 1) immer 라이브러리 설치 yarn a.. 2021. 8. 30. (React) 리액트 Todo List + 색깔 바꾸기 기능 추가/ 작은 프로젝트 (React) 리액트 Todo List + 색깔 바꾸기 기능 추가 포스팅 요약 1. 결과 화면 2. 기능 소개 3. 나중에 추가할 항목 4. 개선해야 될 점 5. 깃허브 코드 6. 복습한 내용 1. 결과 화면 2. 기능 소개 1) 리스트 작성 후 추가 2) 리스트 제거 3) 완료한 리스트 체크 4) app 색상 고르기 3. 나중에 추가할 항목 1) modify 기능: 할 일 수정 기능 4. 개선해야 될 점 1) useCallback을 사용하여 렌더링 최적화 5. 깃허브 코드 https://github.com/6810779s/todoList-app-project GitHub - 6810779s/todoList-app-project Contribute to 6810779s/todoList-app-projec.. 2021. 8. 28. 이전 1 2 3 4 5 6 7 ··· 9 다음
