구차니의 잡동사니 모음

[링크 : https://code.tutsplus.com/ko/tutorials/the-30-css-selectors-you-must-memorize--net-16048]

css를 작성하다 보니

어떻게 운용해야 할지 고민하다가 찾는중.

BEM은 일종의 클래스 명 작성규칙이고

쓰기 나름이긴 한데.. 어떤식으로 운영하는게 나을지 모르겠다...

예를들면.. 색상에 대한 class와 font에 대한 클래스를 구분하고

사용하는 곳에서 복수개의 class를 사용하는 방법과

특성에 따른 class를 개별로 정의하여 사용하냐 정도의 차이?

[링크 : https://www.vobour.com/-css-디버깅-시간을-절약-할-수있는-css-명명-규칙]

[링크 : https://windtale.net/blog/maintainable-expandable-front-end-web-strategy/]

[링크 : http://wikibootup.org/post/css-co-work/]

[링크 : https://hyeonseok.com/docs/about-css/]

웹 퍼블리싱 관련 이것저것 보다 보니 보여서 검색

일단 semantic은 "의미적"이라는 뜻인데

기존의 <b>와 같이 bold로 굵게 하라는 행동 기반이 아닌

<strong>이라는 강하게 표현하고 표현 방식은 뒤로 맡기는 그런 류의 접근 방식으로 보인다.

가장 많이 보는 걸로는

<header>

<nav>

<section>

<footer> 등이 있다고 하면 간단하게 이해 될 듯

HTML구성 요소로서 어떠한 보여주는게 아닌

어떠한 문맥을 의도를 보여주는 meta 데이터로서의 tag 라고 하면 되려나?

[링크 : https://www.w3schools.com/html/html5_semantic_elements.asp]

[링크 : http://west849.tistory.com/4]

[링크 : http://coderap.tistory.com/499]

모든 것의 원흉은 이녀석이었나..

단순하게 div를 왼쪽부터 딱딱딱 원하는 순서로 쌓는용도로만 생각을 했는데

말그대로 float 하게 하는거라 내가 의도하는 것과는 전혀 다른 형태로 작동해서 멘붕중

정 안되면

style="clear:both;" 와

style="overflow:hidden;" 을 해주면 내가 쓰려는 용도로는 충분하네..

[링크 : http://naradesign.net/wp/2008/05/27/144/]

[링크 : http://blog.wystan.net/2008/09/11/css-overflow-clearing-float]

overflow:hidden은 float로 하면 구성요소에서 빠져나가

상위 div의 높이 계산이 갱신되지 않는데, overflow:hidden을 해주면 float로 된 div를 포함하여 높이를 계산한다.

node.js에서 소스 건드리면 빌드하고

자동으로 웹 브라우저 리프레시 하는데 그게 신기해서 검색

[링크 : https://www.npmjs.com/package/browser-refresh]

[링크 : http://2ality.com/2012/08/jsreload.html]

+ 2018.09.04

전에 한걸 보니 node.js가 아니라 angular 였고, 

순수 node.js에서는 서버 재시작이나 브라우저 갱신이 지원되지 않는다.

그래도 위의 browser-refresh가 더 인기가 좋은 듯

[링크 : https://www.npmjs.com/package/reload]

+ 2018.09.06

[링크 : https://medium.com/engineering-on-the-incline/reloading-current-route-on-click-angular-5-1a1bfc740ab2]

오홍.. 신기하네

[링크 : https://github.com/tudou527/marketch]

document.getElementById(id).onclick = function(){code}

[링크 : https://www.w3schools.com/js/js_htmldom_document.asp]

$(document).ready(function(){

    $("p").dblclick(function(){

        $(this).hide();

    });

});

[링크 : https://www.w3schools.com/Jquery/jquery_events.asp]

인라인 스타일이 우선

id로 지정된 것이 다음

태그로 지정된건 가장 나중

id랑 class랑 싸우면 어떻게 되려나?

[링크 : https://opentutorials.org/module/484/4149]

[링크 : https://www.w3schools.com/css/css_specificity.asp]

요건 class 여러개 사용시 우선순위 관련

!important가 우선시되고

css 파일상에 가장 마지막에 선언된 클래스가 우선권을 가진다고

[링크 : https://stackoverflow.com/questions/3066356/...defined]

[링크 : http://pyrois.tistory.com/5]

ajax

https://wayhome25.github.io/django/2017/06/25/django-ajax-like-button/

아니.. 앵귤러가 아니었다니.. 이게 무슨소리요 사장양반(?!)

django는 python을 이용한 녀석이라 파이썬과 버전을 맞추어야 한다.

python 2.7대가 고인물이라 이걸 쓰려면 django-1.11 LTS를 써야 하고

그 이상 버전은 python 3.x 대를 쓰면 해결될 듯

그리고 python - pip - djang 순으로 설치하면 끝

일단 귀찮으니(?) 파이썬 2.7 설치부터 주르륵 (윈도우 기준)

다운로드

[링크 : https://www.python.org/downloads/release/python-2715/]

환경변수 설정(윈도우 기준)

C:\Python27

C:\Python27\Scripts

pip 설치 스크립트

[링크 : https://bootstrap.pypa.io/get-pip.py]

pip 설치

장고 설치

장고 프로젝트 생성

장고 프로젝트 실행

[링크 : https://www.djangoproject.com/] - 일단은 웹 프레임워크라고 정의함

[링크 : https://docs.djangoproject.com/ko/2.0/intro/tutorial01/]

장고와 vscode 연동

python lint 어쩌구 받고

pylint 설치하고 하라는대로 설치

[링크 : http://ruddra.com/2017/08/19/vs-code-for-python-development/]

관리 정보 생성

[링크 : https://tutorial.djangogirls.org/ko/django_start_project/]