일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- Spring Boot
- JVM
- Web Server
- laravel
- it
- php
- Spring
- springboot
- devops
- redis
- db
- Git
- ReactJS
- tool
- Design Patterns
- 요리
- linux
- jsp
- elasticsearch
- 맛집
- ubuntu
- IntelliJ
- MySQL
- jenkins
- javascript
- java
- Gradle
- Oracle
- Spring Batch
- AWS
- Today
- Total
목록Javascript & HTML & CSS (70)
아무거나
indexedDB: WebStorage 로 커버가 불가능한 복잡한 데이터 구조 또는 많은 데이터를 저장하고 관리해야 하는 경우에 사용하며 메일 클라이언트, 할 일 목록 등 작업에 유용특징javascript 기반의 객체지향 데이터 베이스 즉, javascript 가 인식할 수 있는 자료형과 객체를 저장할 수 있다. (localStorage 는 String 형태만 저장 가능)트랜잭션을 사용하며 Key-Value 데이터 베이스이다.비동기 API 이다.색인을 사용하여 복잡한 쿼리를 가능하게 하여 검색 성능을 향상장기 데이터 저장, 브라우저 재 시작 및 시스템 충돌 방지 기능을 제공그 외localStorage 에 비해 속도가 느림(Trade-Off)사용자가 수동으로 삭제하지 않는 이상 데이터가 계속 남아있음사용법..
기본구성 또는 커스텀 라이브러리 구성중 선택하여 사용하면 된다. log4js-node 로그 라이브러리 적용 기본구성 설치 // https://github.com/log4js-node/log4js-node $ npm install log4js 샘플 const log4js = require("log4js"); const logger = log4js.getLogger(); log4js.configure({ appenders: { test: { type: "file", filename: "test.log" } }, categories: { default: { appenders: ["test"], level: "info" } }, }); app.get(`/test`, async (req, res) => { try..
React + Typescript 에서 FC 를 사용하면 안되는 이유 먼저 React17 이하에서는 아래와 같이 React.FC 사용이 가능하며 React18 이상부터는 없어졌다고 한다. 참고 그러나 FC 를 사용하는건 좋은 방법이 아니며 CRA 에서는 여러가지의 이유로 FC 를 없애야 한다고 이슈가 올라왔었고 반영되었으며 이유는 아래 설명을 참고하자. children 을 암시적으로 가지고 있다. FC 를 이용한 컴포넌트 props 는 type 이 ReactNode 인 Children 을 암묵적으로 가지게 되며 이는 꼭 타입스크립트에 한정하지 않더라도 안티패턴이라고 한다. 왜냐하면 children 이라는 암묵적이었던 키워드는 자식노드가 필요한지 아닌지의 의도를 명확하게 드러낼 수 없다는, 타입의 관점에서..
S3 에 File Upload 기능 구현 라이브러리 설치 $ npm install multer $ npm install aws-sdk File Upload Util const fs = require("fs") const path = require("path") const multer = require("multer") /** * Save For File Upload (Use Multer Module) */ export const saveForFileUpload = multer({ storage: multer.diskStorage({ destination(req, file, done) { const dirPath = path.resolve("./") + "\\uploads" if (!fs.existsSyn..
node-schedule 을 활용한 스케쥴러 구현 module 설치 // https://www.npmjs.com/package/node-schedule $ npm i node-schedule 코드 [index.js or app.js] const schedule = require('node-schedule'); const express = require('express'); const app = express(); app.get('/', function (req, res) { res.send('Hello World'); }) app.listen(3000, function(){ console.log('Express start on port 3000!'); schedule.scheduleJob('* * * *..
Nodejs Express Document 기능 S3 에 File Upload 기능 구현 라이브러리 설치 $ npm install multer $ npm install aws-sdk File Upload Util const fs = require("fs") const path = require("path") const multer = require("multer") /** * Save For File Upload (Use Multer Module) */ export const saveForFileUpload = multer({ storage: multer.diskStorage({ destination(req, file, done) { const dirPath = path.resolve("./") + "\..
npx prisma generate 명령실행 후 애플리케이션 구동시에 DB/컬럼 관련 오류가 발생하는 경우 prisma 에서 마이그레이션은 schema.prisma 파일에 정의해놓은 스키마에 변화가 있을 경우 사용하고 있는 DB 에도 업데이트를 해주기 위해 사용하는 연산 그러나 여기서 히스토리가 꼬이는경우 즉, 스키마 파일을 수정 하기 전에 마이그레이션을 하지 않고 그냥 버전을 건너 뛰어서 마이그레이션을 할 때 발생함 해결하려면 기존 히스토리를 무시하고 새롭게 마이그레이션을 진행하고 이제 그 마이그레이션 부터 다시 마이그레이션을 적용하는 방법 (마이그레이션으로 인하여 DB도 초기화가 되어 데이터가 날아가므로 반드시 백업을 해야된다!) $ prisma migrate dev --name initial-mig..
Mocking 라이브러리를 활용하자 프론트엔드 개발시에 가장 이상적인 프로세스는 기획, 분석, 백엔드 개발, 프론트 개발들의 작업들이 서로 겹치지 않고 각각 진행되는 것이 좋다. 하지만 진행하는 과정에서 나오는 이슈 또는 요구사항의 변경등으로 인하여 번거롭게 작업을 진행해야되는 경우가 많다. 또한 프론트 엔드 영역과 백엔드 영역에 대한 일정이 서로 겹치게 동시 진행하는 경우도 많으므로 백엔드의 API 의 의존적이게 작업해야하는 프론트엔드의 경우는 백엔드 API 기능들이 개발서버에 배포되기 전까지 프론트엔드에서는 진행하기에 번거롭다. (물론 백엔드쪽에서 굳이 개발서버 배포를 안해도 로컬에서도 바로 확인 할 수 있는 다른 방법들이 있지만 인원이 많을 경우 변동성이 적은 개발서버 기준으로 작업하는것이 안정적이..
해당 글은 https://bkjeon1614.tistory.com/264 에 내용을 더 추가하여 작성하였다. Javascript var, let, const 개념 및 차이점 Key Point var, let: 변수를 선언하는 키워드이다. const: 상수를 선언하는 키워드이다. Example Code // 1. var는 값을 재 할당 가능하다. var name = "test"; name = "test2"; // 2. let은 var처럼 재 할당이 가능하다. let score = "1"; score = "2"; // 3. const는 값 재할당이 불가능하며 선언과 동시에 리터럴 값을 할당해야 한다. const PI = "3.14"; let, const는 ECMA6에 도입된 키워드이며 var 타입으로 인한 ..
computed vs watch computed 이미 정의된 계산식에 따라 결과값을 반환할 때 사용 종속 대상을 따라 저장(캐싱) 됨 (단, Date.now() 같이 아무곳에도 의존하지 않는 computed 속성의 경우 절대로 업데이트가 안됨 즉, 캐싱을 원하지 않을 때 메소드를 사용하면 된다.) [example vuejs code] computed: { now: function () { return Date.now() } } 샘플코드 [example html code] 뒤집힌 메시지: "{{ reversedMessage() }}" [example vuejs code] // 컴포넌트 내부 methods: { reversedMessage: function () { return this.message.spl..