일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 | 31 |
- js
- 백준
- Git
- 알고리즘
- Mac
- 자바스크립트
- 사이트
- CSS
- javascript
- array
- 코딩테스트
- 런타임에러
- 5기
- vscode
- 지속가능한개발자
- Object
- node
- Django
- 정보처리기사
- 개발자
- boostcamp
- 부스트캠프
- 실기
- Express
- react
- 배포
- 네이버커넥트재단
- python
- 코테
- 삼각형
- Today
- Total
목록개발 (48)
개발 공부 기록
1. 설치하기 pip install libsass django-compressor django-sass-processor 2. settings.py 변경 INSTALLED_APPS = [ ... 'sass_processor', ... ] SASS_PROCESSOR_ENABLED = True SASS_PROCESSOR_ROOT = os.path.join(BASE_DIR, 폴더명(있을 경우), 'static') SASS_OUTPUT_STYLE = 'compact' 3. 프로젝트에서 호출 {% load sass_tags %} 참고: blog.jaeyoon.io/2017/10/django-sass.html
Sass(syntactically awesome stylesheets) 는 CSS로 해석 및 컴파일되는 스크립트 언어이다. SASS 변수 정의 변수는 $ 로 시작하며 4가지 자료형을 지원한다. - 수(단위 포함) - 문자열(인용 부호가 있거나 없이) - 컬러 (하나 이상의 이름) - 불리언 변수는 매개변수로 사용하거나 결과물이 될 수 있다. 예시 $primary-color: #3bbfce $margin: 16px .content-navigation border-color: $primary-color color: darken($primary-color, 10%) .border padding: $margin/2 margin: $margin/2 border-color: $primary-color 루프 Sass..
개발을 할 때는 브라우저 하위 호환성을 고려하면서 개발을 진행해야 한다. caniuse.com/를 통해 브라우저에서 내가 원하는 기능이 얼만큼 지원되는지 확인할 수 있다. 예로 array.prototype.includes는 94.85%의 브라우저에서 지원이 됨을 확인할 수 있다. kangax.github.io/compat-table/es6/를 통해 각 브라우저에서 지원하는 기능을 한 눈에 확인 할 수 있다. 우리는 transpiling을 통해 하위 브라우저에서도 동작하게 문법을 바꾸고, polyfill을 통해서 지원하지 않는 native API를 다른 코드로 동작하게 할 수 있다. Transpiling 트랜스파일링(transpiling)이란 무엇일까? 한 언어로 작성된 소스코드를 비슷한 수준의 추상화를 ..
getElementById querySelector 해당 선택자에 맞는 element가 없다면 null을 반환 선택자에 맞는 element들 중 첫번째 것을 반환 querySlectorAll은 모든 element를 반환 해당 선택자에 맞는 것이 없다면 null을 반환 - 인접한 태그들끼리의 상대적인 위치를 비교하여 가져올 수 있음 처리 속도가 더 빠름 처리 속도가 더 느림 리턴값은 HTMLCollection name, id, index number로 HTMLCollection의 항목(itmes)들에 접근할 수 있음 리턴값은 NodeList index Number로만 NodeList의 항목(items)들에 접근할 수 있음 참고 whatabouthtml.com/difference-between-getelem..
PR을 Merge하는 방법에는 3가지 존재한다. Create a merge commit git merge 명령이랑 똑같다. PR의 commit들이 merge message와 함께 master의 Head commit으로 들어간다. Squash and merge PR의 commit log들을 한개로 추려서 master에 병합하는 방법이다. PR의 제목으로 된 1개의 커밋로그가 master에 병합된다. (master의 commit log가 깔끔해진다.) Rebase and merge PR의 commit log들이 master에 재정렬돼서 병합된다. 로컬에서 작성된 모든 commit log들까지 추적할 수 있다는 장점이 있다.
pattern pattern 속성은 요소의 값을 확인 해야할 정규표현식(regular expression)을 지정 required required 속성은 부울(boolean) 속성. 존재하는 경우, 폼을 제출 하기 전에 입력필드가 작성되어야만 함을 지정. required 속성은 다음의 입력 필드 타입에서 작동: text, search, url, tel, email, password, date pickers, number, checkbox, radio, and file. autofocus 페이지가 로드 될 때 자동적으로 해당 요소가 초점(get focus)을 받도록 함 placeholder 입력필드에 기대되는 값을 설명해주는 힌트(샘플 값이나, 포맷에 대한 간단한 설명) 를 지정 value 입력 필드에 대..
BEM: Block Element Modifier BEM 방법론은 ID에는 사용할 수 없고, 오직 클래스명에만 활용할 수 있다. Block 전체를 감싸고 있는 블럭요소 Element 요소는 블럭이 포함하고 있는 한 조각 Modifier 블럭 또는 요소의 속성 사용 .block‐‐modifier {…} .block__element‐‐modifier {…} 출처 webclub.tistory.com/263 nykim.work/15