본문 바로가기

분류 전체보기321

PostgreSQL 과 Node.js 회사에서 PostgreSQL 을 쓴다고 한다. 지금껏 MySQL 만 사용해서 친숙한 돌고래를 보내고 ... 코끼리를 마주하니 막막했다. 그래도 쿼리문 작성 자체는 Postgre 가 편한거 같기도.. 조금씩 다르긴 하지만 일단 큰 줄기는 같으니까. 하지만 역시 SQL 보다 NoSQL 이 사용하기 용이한 느낌은 버릴 수가 없다. 그립다 ... MongoDB PostgreSQL 을 사용하기 위한 pg 설치 yarn add pg Controller 작성 pg 에서 데려온 Client 로 정보를 넣어주고, 연동시켜준다. 나머지는 간단하게 connect() 해주면 된다! const { Client } = require('pg'); const client = new Client({ user: process.env.P.. 2023. 8. 10.
PostCSS 란 https://postcss.org/ CSS 작성을 더 편하게 만들어주는 후처리기 => 자바스크립트를 사용하여 CSS를 변경CSS 전처리기 CSS 전처리기 화면에 보여주기 전 CSS를 변경해서 스타일을 적용 사용자가 작성하기 쉬운 코드로 작성 -> 기본 CSS 변환 -> 렌더링 ex. Scss, Stylus, Less CSS 후처리기 화면에 보여준 뒤 CSS 스타일을 적용 기본 CSS 파일 작성 -> 렌더링 -> 외부 프로그램을 사용하여 스타일 변경 ex. PostCSS 이러한 CSS 전/후처리기는 CSS를 작성할 때 발생하는 번거로움(중복, 유지보수 등)을 줄여준다. PostCSS 설치 npm install -D postcss postcss-loader 설치해주고 웹팩 설정에 추가해준다. webpack.. 2023. 8. 5.
Webpack 프론트엔드 개발환경 세팅 https://www.youtube.com/watch?v=zal9HVgrMaQ npm init nodejs 기반의 패키지를 만들어줄 때 입력해준다. 그러면 package.json 이 생기게 된다. npm install webpack webpack-cli --save-dev 웹팩 설치, webpack-cli 는 웹팩을 커맨드라인으로 설정해줄 수 있는 패키지이다. 기본 웹팩 설정 + js 설정 webpack.config.js 웹팩 설정 관련 파일, 웹팩을 실행했을 때 이 파일 안의 내용을 실행해준다. const path = require("path"); module.exports = { entry: "./src/index.js", output: { filename: "main.js", path: path.r.. 2023. 8. 2.
웹 최적화 기법 - 캐시 최적화 Serve static assets with an efficient cache policy => 네트워크를 통해 다운로드하는 리소스에 캐시를 적용하라는 의미 캐시 자주 사용하는 데이터나 값을 미리 복사해둔 임시 저장 공간 또는 저장하는 동작 웹에서 서비스에서 사용하는 이미지나 자바스크립트 파일을 매번 네트워크를 통해 불러오지 않고 최초에만 다운로드하여 캐시에 저장해두고 그 이후 요청 시 저장해둔 파일을 사용한다. 웹에서 사용하는 캐시의 종류 메모리 캐시 메모리에 저장하는 방식 RAM 디스크 캐시 파일 형태로 디스크에 저장하는 방식 어떤 캐시를 사용하는지 직접 제어가 불가하며 브라우저가 사용 빈도나 파일 크기에 따라 특정 알고리즘에 의해 알아서 처리된다. 단순 새로고침을 한 후 확인한다면 메모리 캐시가 많.. 2023. 8. 1.

티스토리툴바