gaki gaki

1. postgreSQL 설치 https://postgresapp.com/ 위 링크에서 postgreSQL 설치 후 postgreSql 실행 2. 데이터 베이스 접속 psql 언어로 mysite 라는 이름의 데이터 베이스 생성 3. Django 와 postgreSQL 연동 #in setting.py DATABASES = { 'default': { 'ENGINE': 'django.db.backends.postgresql', 'NAME': 'mysite', 'USER': 'gak', 'PASSWORD': 'password', "HOST": 'localhost', &#..

[webpack] 기본 개념 1. 웹팩의 사용이유 웹팩은 여러개의 파일을 하나로 합쳐주는 모듈 번들러입니다. 파일을 하나로 합치게 되면 서버로 보내는 요청의 횟수가 적어져 성능상의 이점을 가져올 수 있습니다. 2. 웹팩의 사용법 프로젝트 폴더에 npm 을 init 해줍니다. npm init -y 웹팩과 웹팩 cli 를 dev 모드로 설치합니다. dev 모드로 설치하는 이유는 웹팩은 파일을 하나로 묶어주는 역할만 할 뿐 실제 비지니스 로직에서는 사용되지 않기 때문에 dev 모드로 설치합니다. npm install webpack webpack-cli --save-dev package.json 에 webpack 명령어를 기입해줍니다. build : "webpack" webpack.config.json 에서 어..

특정 문자로 시작하거나 끝나는 element 선택하는법 위와 같이 element 가 있을 때 클래스 이름이 div_ 로 시작하는 모든 엘리먼트를 선택하는 방법 [class^="div_"] { ~~~ } 이런식으로 선택하면 된다. 만약 클래스 이름이 _a 로 끝나는 앨리먼트를 선택하고싶으면 [class*="_a"] { ~~} 로 선택하면 된다.

css 의 선택자를 활용해 부모 element 에 event 를 전달할 수 있을까? css 의 선택자를 활용해 형제 혹은 자식 엘리먼트를 선택하여 이벤트를 전달 할 수 있지만, 부모 엘리먼트에 이벤트를 전달할 수는 없다. css 선택자 체이닝을 통해 형제의 자식 엘리먼트에 이벤트를 전파할 수 있다. 선택자 https://developer.mozilla.org/ko/docs/Web/CSS/CSS_Selectors CSS 선택자 - CSS: Cascading Style Sheets | MDN CSS 선택자는 CSS 규칙을 적용할 요소를 정의합니다.CSS 선택자는 CSS 규칙을 적용할 요소를 정의합니다. developer.mozilla.org

css 의 style 과 jsx 에서 하드코딩된 style 이 겹치면 어떻게될까? => jsx 의 스타일이 더 우선순위로 적용된다. //in css .contain { background-color: red; }; // jsx 일 경우, jsx 의 css 가 더 우선순위로 적용되어 background-color 는 blue 가 된다.

1. npm install react-router react-router-dom @types/react-router @types/react-router-dom react-router-dom 에 link , useNavigate, BrowserRouter 가 전부 들어있다.

1. 먼저 create-react-app 으로 기본 개발 환경을 셋팅한다. 2. https://eslint.org/docs/user-guide/getting-started Getting Started with ESLint Getting Started with ESLint ESLint is a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code, with the goal of making code more consistent and avoiding bugs. In many ways, it is similar to JSLint and JSHint with a few exceptio eslint.org 위 링크에 ..

1. npm install --save typescript @types/node @types/react @types/react-dom @types/jest 으로 타입스크립트 리액트 모듈을 설치한다. 2. .jsx 확장자 파일을 .tsx 로 바꾼다. 3. npm start 를 했더니 chalk.constructor is not a construtor 이라는 에러가 떴다. 구글링 해도 에러의 원인을 찾기 어려워서 아마 기존에 존재하는 js 관련 모듈과 ts 가 충돌이 날것이라고 추측했다. 그래서 일단 차근차근 해야할것을 진행해보기로 했다. 4. tsconfig.json 추가 5. package.json 에 dependency 파일들을 앞에 @types/ 를 붙여서 타입스크립트 파일로 바꿈. 단, react-..