본문 바로가기
반응형

코딩121

HTML 주석 처리 방법 1. 처리 방법 HTML 주석 처리 방법은 매우 간단하다. ' 3. 용도 본인이 해당 코드 내용을 까먹지 않게 기록하거나 너무 많은 코드가 중복될 때 유용하다. 또한, 티스토리 블로그를 이용하는 사람들도 네이버, 구글 검색 메타 태그 같은 것을 이용할 때도 유용하게 사용할 수 있음. 2021. 1. 24.
안드로이드 어플, 퐁튜브 안드로이드 어플, 퐁튜브는 동영상 콘텐츠 판매 플랫폼이다. 내 생각엔 php, mysql, 호스팅 서비스 등으로 이뤄져 있는 것 같다. 안드로이드 언어로 구성되어 있는데 이미 나와있는 어플들을 대상으로 공부해보면 (비교) 이해가 잘될듯. 2019. 6. 2.
누구를 위한 글인가? 누구를 위한 글인가. 의도치 않게 근래 들어 코딩 복습 글을 못 남기고 있다. 개인 기록용으로 남기위해서 각 편마다 글을 남겼었는데 (생활코딩 관련) 다시 봐도 그렇게 크게 와닿지 않는다. = 효용성이 없다. 그냥 아예 그 주제에 대해서 크게 크게 적고 분류해서 제대로 쓰는게 나을지도 모르겠다. 내가 세운 계획을 차근 차근 이루기 위해... 제대로 하고... 약간 시간이 더 걸리더라도 쌓아가는 방식으로 글을 남겨야 겠다. (전체적인 숲 --> 나무) 2017. 4. 3.
자바스크립트 기본 : 비교 자바스크립트 기본 : 비교 (생활코딩) 비교 연산자 : 좌항, 우항을 비교할 때 쓰는 연산자를 의미한다. a=1 처럼, 우리는 이미 연산자를 이용하고 있다. 그 값이 같은지 다른지 크기를 비교하여 true나 false를 구분한다. 참, 거짓. 대입 연산자 (=) 우항의 값을 좌항에 대입할 때 사용. 동등 연산자 (==) : 좌항과 우항의 값이 같으면 트루, 다르면 false 값을 나타냄. 일치 연산자(===) : 동등 연산자와 비슷하나, 데이터 형식까지 비교하는 것임. 1234alert(1==2) //falsealert(1==1) //truealert("one"=="two") //false alert("one"=="one") //true 12alert(1=='1'); //truealert(1==='1').. 2017. 3. 18.
자바스크립트 기본 : 줄바꿈과 여백 자바스크립트 기본 : 줄바꿈과 여백 (생활코딩) 줄바꿈 방법은 ; 세미 콜론을 붙이면 되는데 기본적으로 Enter를 치면 자바스크립트는 줄바꿈으로 인식한다. 하지만, 세미 콜론을 붙이는 습관이 있으면 좋다. (기본) 여백을 줄려면 Tab키를 쓰면되는데 Tab키는 기본적으로 스페이스 4칸이다. 2017. 3. 17.
자바스크립트 기본 : 주석 자바스크립트 기본 : 주석 주석은 브라우저가 코드를 무시하는데, 결과 값을 미리 적거나 설명이 필요할 때 주로 쓴다. //형태와 /* */가 있다. 일시적으로 코드의 동작을 멈출 때도 쓴다. 2017. 3. 14.
자바스크립트 기본 : 변수 자바스크립트 기본 : 변수 (생활코딩) 변수란, (Variable) 어떤 값을 담는 혹은 유지할 필요가 있을 때, 변할 수 있는 영역을 지칭한다. var로 지칭하며 시작할 수 있다. 숫자나 문자 상관없음. Ex. Var a = 1, b=2 변수라는 것을 왜 해야하는가? 코드의 유지보수를 위해서 변수라는 함수를 이해하여야 한다. 10과 100번 더하고, 300을 나누는 코드를 작성했다고 하자. 만약 변할 수 있는 부분과 변할 수 없는 부분을 나누지 않았다면? 즉, 변수성으로 고려하지 않았다면, 일일이 수정해야하고 인간의 인지능력만으로 힘든 순간이 온다. 그렇기 때문에 변하는 부분과 변하지 않는 부분을 구분하여 효율적인 작업을 할 수 있게 한다. 1234alert(100+10);alert((100+10)/1.. 2017. 3. 14.
자바 스크립트 기본 : 숫자와 문자 자바 스크립트 기본 : 숫자와 문자 (생활코딩) 자바스크립트 데이터 형식에는 크게 2가지가 있다. 문자와 숫자! 문자는 "사이에 기록해야 한다." (큰 따옴표) 숫자는 정수와 실수로 나누고, 사칙연산이 가능하다. 함수를 쓰면 복잡한 연산도 가능. 숫자도 "1" 쓰면 문자로 인식한다. 123456Math.pow(3,2); // 9, 3의 2승 Math.round(10.6); // 11, 10.6을 반올림Math.ceil(10.2); // 11, 10.2를 올림Math.floor(10.6); // 10, 10.6을 내림Math.sqrt(9); // 3, 3의 제곱근Math.random(); // 0부터 1.0 사이의 랜덤한 숫자 \ = escpae. alert ('java script')에서 문자를 띄우고 .. 2017. 3. 14.
자바스크립트 기본 : 실행방법과 실습환경 자바스크립트 기본 : 실행방법과 실습환경 (생활코딩) 웹 브라우저 (구글 크롬 개발자 모드) 자바스크립트는 HTML, CSS 등을 동적으로 제어하기 위한 언어인데, 하지만, 오늘날에는 그 용도 뿐만 아니라, 다양하고 넓게 쓰임이 발전을 했음. node.js 플러그 인, 크롬, 위젯 등... 서브라임 텍스트. 지속적 도구 찾는 노력 포크레인 삽 비교. 2017. 3. 8.
자바 스크립트 자바 스크립트 : 언어소개 (생활코딩) 자바 스크립트(Java Script) 자바스크립트란, 웹 브라우저를 프로그래밍적으로 제어하기 위한 언어이다. ex ) onclick="alert('hello world')" --> 자바스크립트 언어. # 최근에는 탈 웹브라우저, 탈 웹화가 진행되면서 자바스크립트는 브라우저 제어에만 쓰이는 것 뿐만 아니라, 웹서버(node.js)나 다양한 분야(구글 앱 스크립트, 유틸리티 등)에서 중요한 언어로 존재감을 나타내고 있다. 점점 자바스크립트의 영향이 커지고 있다. # 이 자바 스크립트 소개에서는 언어와 환경적 요소 중에서 언어(문법)에 관한 것부터 공부해나갈 것이다. 2017. 3. 6.
유지보수 : 코드 경량화(minify) 유지보수 : 코드 경량화(minify) - 생활코딩 웹 사이트의 규모가 커졌을 때, 코드 자체를 경량화 하는 기술. - 작게 만드는 기술 : 코드를.. 경량 전 body{}h1{ color:tomato;} 경량후 h1{color:tomato} 2017. 2. 24.
유지보수 : link와 import 유지보수 : link와 import (생활코딩) 수정해야 할 코드가 1000개, 10,000개 이상이면 어떻게 해야하나? 일일이 수정하는가? No. (중복을 제거해야 함.) 유지보수의 관점에서 상당히 비효율적이다. CSS 코드를 분리해서 HTML 코드를 경량화 시킬 수 있다.(유지보수의 편의성이지, 용량 자체가 줄어든다는 것이 아니다.)-> 캐시 저장 (웹 브라우저), 다운 CSS에서 CSS, HTML로 불러오는 ? (import) 차이가 있을 뿐.. 똑같은 기능이며, 동작한다.. 2017. 2. 24.
모션그래픽 : 전환(transition) 모션그래픽 : 전환(transition) - 생활코딩예제 - transition_2.html12345678910111213141516171819202122232425262728293031323334353637 body{ background-color: black; transition:all 1s; } div{ background-color: black; color:white; padding:10px; width:100px; height:50px; -webkit-transition: all 500ms cubic-bezier(0.680, 0, 0.265, 1); /* older webkit */ -webkit-transition: all 500ms cubic-bezier(0.680, -0.550, 0.265.. 2017. 2. 23.
그래픽 : SVG 그래픽 : SVG (생활코딩) SVG는 CSS가 아니지만, CSS를 이용할 때 다양한 효과를 SVG를 활용하는 경우가 많음. SVG는 벡터(vector) 이미지를 표현하기 위한 포맷임. w3c에서 만든 백터 이미지 국제 표준. vector vs bitmap벡터는 이미지가 깨지지 않는다. -> 형태의 곡선으로 (그림) 기억 SVG 비트맵은 이미지가 깨진다. -> 격자 형식으로 기억 PNG thenounproject.com --> icon (다운 PNG, SVG) svg 만드는 방법. 예제 - svg_2.html1234567891011 file htmls 2017. 2. 23.
그래픽 : 변형(transform) 그래픽 : 변형(transform) - 생활코딩 그래픽 프로그램을 통해서 했던 것을 (CSS3부터) CSS로, 즉, 코드로 편집이 가능해짐. 2차원 transform, 3차원 transform이 있음. 실제로 3D를 구현하려면 상당한 작업과 난이도가 따르므로 라이브러리를 이용하는게 좋음. (css transform library 검색) h1 : hover { transform : scale(1.5); --> 마우스를 갖다되면 커짐.} 2017. 2. 23.
반응형