반응형

전체 글 946

[React] Nginx 새로고침 404 에러 수정

location / { try_files $uri $uri/ /index.html =404; } React를 배포하고, Nginx를 활용하여 서비스를 실행한 경우, index.html을 통하여 원하는 페이지로 이동 시에는 잘 넘어 가지만, 이동한 페이지에서 새로고침(F5)을 하는 경우 404 에러를 발생하게 됩니다. 이를 해결하기 위해서는, 새로고침으로 전달된 uri 정보를 index.html를 통하여 uri로 이동하도록 설정을 해주어야 합니다. server { listen 80; server_name localhost; #access_log logs/localhost.log combined; location / { try_files $uri $uri/ /index.html = 404; root /dat..

[Express] 파일 다운로드

res.download(path [, filename] [, options] [, fn]) path : 다운로드할 파일의 경로 filename : 다운로드 받을 파일 이름 options : 다운로드 설정 fn : callback 처리 사용방법 const express = require('express'); const app = express(); /** * 첨부파일 다운로드 */ app.get('/api/file/download', async(req, res) => { const filepath = "/filepath/filename.txt" const filename = "downfile.txt"; if(fs.existsSync(filepath)){ res.download(filepath, filena..

[React] 상대경로 설정하기

// jsconfig.json { "compilerOptions": { "baseUrl": "src" }, "include": [ "src" ] } React에서 내부 컴포넌트를 import시에 기본적으로는 아래와 같이 사용하곤 합니다. 1번 라인에 보면 ../../../utils/CommonUtils 라고 되어있는데, 만약 아래와 폴더구조가 같다면 src ├─ utils │ └ CommonUtils.js └─ view └ front └ comp └ CondMonth.js 현재 CondMonth.js라는 파일이 있는 폴더(comp)의 상위 폴더(front)의 상위 폴더(view)의 상위 폴더(src)에서 utils 폴더의 CommonUtils.js를 import 합니다. 이는 두 가지 측면에서 개발의 어..

[CentOS] npm 실행 Service 등록

$> sudo vi /etc/systemd/system/{서비스 이름}.service [Unit] Description={서비스 설명} [Service] Type=simple Restart=always User=root Group=root WorkingDirectory={Root 폴더} ExecStart=/usr/bin/npm start [Install] WantedBy=multi-user.target $> sudo systemctl enable {서비스 이름}.service $> sudo systemctl start {서비스 이름}.service {서비스 이름} : 만들고자 하는 서비스의 이름 {서비스 설명} : 해당 서비스에 대한 간단한 Description {Root 폴더} : 해당 node 프로젝..

[CSS] 내부 border 설정하기

/* offset-x | offset-y | blur-radius | spread-radius | color */ element.style { box-shadow: 0 0 0 10px #202020 inset; } 일반적으로 border는 아래와 같이 선언합니다. border: 10px solid #202020 ▶︎ 해당 elemenet의 border 너비는 3px로 약간 검정(#202020)의 직선(solid)으로 설정 position: fixed ▶︎ element의 위치를 화면의 고정 위치(fixed)에 표시 top: 100px ▶︎ element를 화면 기준 위에서 100px 만큼 아래로 이동하여 표시 left: 100px ▶︎ element를 화면 기준 왼쪽에서 100px 만큼 오른쪽으로 이동하..

개발 창고/Web 2022.10.10

[CSS] Elemnt 스타일 초기화

/* 버튼 초기화 */ button { background: inherit ; border:none; box-shadow:none; border-radius:0; padding:0; overflow:visible; cursor:pointer} /* 테이블 초기화 */ table { width:100%;border-collapse:collapse;table-layout:fixed;font-size:100%;border-spacing:0 } /* 리스트 초기화 */ ul, ol { list-style:none } /* Anchor 태그 초기화 */ a { text-decoration:none;color:#202020; } a:hover, a:active, a:focus { text-decoration:non..

개발 창고/Web 2022.10.07

[Puppeteer] Element Exists

// 아이템 체크 let exists = false; try { // 현재 selector >> "#gnb .group_nav .list_nav .nav_item" exists = await page.$eval("#gnb .group_nav .list_nav .nav_item", ele => ele?true:false); }catch (e){ // 에러 처리 console.log(e); } puppeteer를 사용하다 보면 유효성 검사를 위해 해당 element가 있는지 확인해봐야 하는 경우가 있습니다. 만약 위와 같이 네이버 메인의 GNB 첫 번째 항목을 클릭 하는 puppeteer를 생성하려고 합니다. 그런데 만약, 네이버가 메인화면 개편을 하여, 해당 항목으로 가는 selector의 정보가 변경되면..

[MSSQL] 시간/날짜 간격 구하기 DATEDIFF

SQL문을 사용하다 보면, 아래와 같은 상황에 직면하곤 합니다. ex) 1. 일주일 전 날씨 정보를 알려주세요. 2. 한 달 전과 오늘의 온도 차를 알려주세요. 3. 1시간 전 매출과 현재 매출을 비교해 주세요. 이 세 가지 예시의 동일한 점은 "OO 전"이라는 점입니다. 이는 시간을 가지고 비교하겠다는 거고, 일단 WHERE에서 일자를 조정할 수 있겠으나 현재 예시를 위해서는 SELECT절에서 처리해 보도록 하겠습니다. 사용방법 SELECT DATEDIFF('구분자', '시작일자', '종료일자') 구분 구분자 약어 년 year yy, yyyy 분기 quarter qq, q 월 month mm, m 일 day dd, d 주 week wk 시간 hour hh, h 분 minute mi, n 초 second..

반응형