전체 글 (449) 썸네일형 리스트형 Webpack5 - webpack 기본 설정으로 빌드시 파일 삭제 하거나 유지시키기 1. 웹팩 파일 설정 [webpack.config.js]module.exports = { entry: './src/index.js', output: { filename: 'bundle.[contenthash].js', path: path.resolve(__dirname, './dist'), /** * publicPath * under version 4: publicPath is empty(''). * over version 4: publicPath is auto * * can use list * 1. 'dist/' * 2. 'https:/.. Webpack5 - 빌드 전 bundle, 원하는 디렉토리 삭제하고 빌드하기 빌드시 임시 이미지 저장 파일디렉토리와 같은 것을 삭제하기 좋다. 1. 라이브러리 가져오기npm install clean-webpack-plugin --save-dev 2. webpack.config.js 설정// can't use ecma script module. use only common.jsconst path = require('path');const TerserPlugin = require('terser-webpack-plugin');const MiniCssExtractPlugin = require('mini-css-extract-plugin');// ↓↓↓↓↓↓ 추가하기const {CleanWebpackPlugin} = require('clean-webpack-plugin');// mini.. Webpack5 - 파일명으로 캐싱하는 브라우저를 피하기 브라우저에서는 캐싱을 파일명으로 한다.build하면 bundle 이름이 budle.js 혹은 style.css 이런 식으로 되는데 빌드 할 때마다 소스가 바뀐다면고유한 값을 파일명으로 부여하여캐싱을 피할 수 있다. 해당 내용을 실습해보자 1. webpack.config.js 수정// can't use ecma script module. use only common.jsconst path = require('path');const TerserPlugin = require('terser-webpack-plugin');const MiniCssExtractPlugin = require('mini-css-extract-plugin');// minimum optionmodule.exports = { entry.. Webpack5 - build시 css 파일 분리하기 1. 패키지 다운 npm install mini-css-extract-plugin --save-dev '--save-dev' 는 개발시에만 사용한다는 의미다.만약 선언하지 않고 받으면 npm run build 시devDependencies, dependencies 중 dependencies에 포함된다. runtime 때는 필요가 없으니 제외시킨다. 다시 말해서 build time 때만 css를 따로 뽑아주는 플러그인이 필요하니devDependencies에 포함되어야 한다. 2. webpack.config.js 설정// can't use ecma script module. use only common.jsconst path = require('path');const TerserPlugin = requir.. react - og tag 생성 후 체크 1. 메타태그 생성 index.html메타태그에 open graph의 약자인 og 태그를 생성합니다. [index.html] 2. 각 메타태그 내용og:title -> 제목og:description -> og태그 설명란og:image -> 대표이미지 og:url -> url Spring boot 3 - Thymeleaf 핫리로드까지는 아니지만 리로드시 적용시키기 [application.yml]spring: thymeleaf: # Thymeleaf cache: false mode: HTML encoding: UTF-8 prefix: file:src/main/resources/templates/ resources: # Static resources static-locations: file:src/main/resources/static/ cache: period: 0 캐시설정을 끄면 된다...! Spring boot3 - h2 설정해서 쓰기, 스키마 쿼리 셋팅 후 datasource를 이용해 미리 h2에 테이블 생성하기 1. 라이브러리 가져오기 (생략) com.h2database h2 runtime (생략) 2. 서버 실행하기실행 후 로그에 특정 주소가 나온다jdbc부터 끝까지 복사 한다. ex) jdbc:h2:mem:11270f92-a5f8-4cf5-a8c7-e1f8388876b3 3. h2 사용한다는 내용 설정하기 [application.properties]spring.h2.console.enabled=true 4. h2 콘솔 진입하여 접속하기 http://localhost:8080/h2-console 접속 완료 위 처럼 로그 보면서 하면 힘드니 Schema를 서버 실행시 미리 생성해놓자 1. 실행시 testdb라는 이름으로 데이터베이스 생성할 수 있도록 설정[application.propert.. Spring boot3 - Spring Actuator 사용하여 health check 하기 1. 라이브러리 가져오기 org.springframework.boot spring-boot-starter-actuator 2. application.properties에 보고 싶은 server 내용 넣기management.endpoints.web.exposure.include=health,metrix#혹은 전부 보고싶을 때는 아래 처럼 설정#management.endpoints.web.exposure.include=* 3. 접속해서 확인하기 기본은 주소는http://도메인/actuator 만약 configProps에 대해 보고싶다면http://도메인/actuator/configProps 서버 요청에 대한 서버 값을 보고싶다면 http://localhost:8080/actuator/.. 이전 1 ··· 14 15 16 17 18 19 20 ··· 57 다음
