이클립스
-
[Javascript] var, let, const 차이(비교)개발자 2021. 6. 10. 21:53
Javascript 자바스크립트에는 변수선언을 할때 var, let, const로 변수선언을 할 수 있습니다. 기존 Java에서는 String, int, boolean, double 등등... 더 세분화 되어있는 타입으로 변수선언을 할수 있었는데요. Javascript 변수선언 타입의 차이들을 알아보려고 합니다. 1. var 이런식으로 var은 변수 재선언이 가능합니다. 변수를 재선언 한다고 해서 에러가 발생하지 않고, 더 늦게 선언된 변수의 값이 출력됩니다. 많은 양의 코딩이 있을 때, 변수선언이 중복되지 않아서 오류가 나지 않는 장점이 있지만, 이는 다르게 이야기 하면 조금 지저분하고 변수명이 중복되어 나중에 유지보수가 불편해진다는 단점이 될 수도 있습니다. 2. let let은 변수 재선언이 되는 ..
-
[html/css] Font Awesome 아이콘 사용하는 방법개발자 2021. 6. 7. 19:28
웹페이지를 보다보면 이미지가 아닌 텍스트 방식의 아이콘이 출력된 것을 볼 수 있다. 컴퓨터 기본제공 특수문자도 아니고 이미지가 아니면 어떻게 그런 아이콘을 만들 수 있었을까? 정답은 Font Awesome에 있다. Font Awesome은 텍스트 방식으로 아이콘을 만들 수 있게 해주는 솔루션이다. Font Awesome은 컴퓨터에서 기본적으로 제공하고 있는 아이콘을 출력하는 방식이 아닌, 특수하게 개발된 Font Awesome 아이콘 전용 폰트 파일을 이용하여 아이콘을 출력하는 방식이다.. 따라서 초보자는 쉽게 구현할 수 없는 아이콘도 Font Awesome만 이용하면 매우 간단하게 아이콘을 만들 수 있다. CSS를 이용하여 아이콘을 만드는 방식이기 때문에 속도도 빠르고 모든 웹브라우저에서 호환된다. h..
-
[html/css] css specificity 특이성규칙이란?개발자 2021. 6. 7. 18:58
( CSS Specificity는 CSS 규칙들이 어떤 하나의 특정 요소에 적용되면서 CSS 규칙들 간의 두 개 이상의 충돌이 생길 경우, 브라우져가 더 한정적으로 선언되어 있는 특정 규칙을 따르게 되는 몇 가지 정해진 기본 적용 순위를 말한다. 대개의 경우, 아주 복잡한 CSS 파일들을 한꺼번에 적용할 경우 이런 충돌이 일어나는데, 이럴 때 웹 디자이너들이 주로 간편하게 선택하는 방법은 더 우선순위를 갖는 규칙에 불필요할지도 모르는 !important 속성을 적용하는 것이다. 이렇게 하면 개발자들로 하여금 어떤 한 요소를 손쉽게 변경할 수도 있게 할 것을 더 복잡하게 만는다. 그래서, CSS Specificity의 올바른 이해와 적용은 모든 웹 개발팀원들에게 바람직할 것이다. 먼저 선택자(selecto..
-
[html/css] 이미지 스프라이트(image sprite)란?개발자 2021. 6. 7. 17:59
-웹 페이지에 이미지가 사용될 경우 해당 이미지를 다운받기 위해 웹 브라우저는 서버에 이미지를 요청하게 됩니다. 하지만 사용된 이미지가 많을 경우 웹 브라우저는 서버에 해당 이미지의 수만큼 요청해야만 하므로 웹 페이지의 로딩 시간이 오래 걸리게 됩니다. 이미지 스프라이트(image sprite)를 사용하면 이미지를 다운받기 위한 서버 요청을 단 몇 번으로 줄일 수 있습니다. 모바일 환경과 같이 한정된 자원을 사용하는 플랫폼(platform)에서는 웹 페이지의 로딩 시간을 단축해주는 효과가 있습니다. 또한, 많은 이미지 파일을 관리하는 대신 몇 개의 스프라이트 이미지(sprite image) 파일만을 관리하면 되므로 매우 간편합니다. 이미지 스프라이트의 단점.. 1)개별 스트라이프 크기(width, hei..
-
[html/css] padding 속성에 대하여...개발자 2021. 6. 1. 18:45
html / css 에서 padding이라는 속성에 대해 알아보도록 하겠습니다. padding은 margin과 거의 비슷합니다! padding 이란 본문 내용과 border 사이의 여백을 의미합니다.. padding은 4가지로 나뉘어 집니다. -padding-top 상단여백 -padding-right 오른쪽여백 -padding-bottom 아래여백 -padding-left 왼쪽여백 style속성으로 padding을 사용하는 방법 *단위는 px, cm, % 등등 가능, 음수(-)도 가능 ●한꺼번에 padding지정하는 방법 padding: ?px ?px ?px ?px; (상단 오른쪽 하단 왼쪽) ●4면 모두 동일한 여백일때 padding지정하는 방법 padding: ?px; ●상단, 오른&왼, 하단 순서 ..
-
[html/css] margin 속성에 대해서...개발자 2021. 6. 1. 18:12
html / css 에서 margin이라는 속성에 대해 알아보도록 하겠습니다. margin 이란 border와 바깥과의 여백을 의미합니다.. margin은 4가지로 나뉘어 집니다. -margin-top 상단여백 -margin-right 오른쪽여백 -margin-bottom 아래여백 -margin-left 왼쪽여백 style속성으로 margin을 사용하는 방법 *단위는 px, cm, % 등등 가능, 음수(-)도 가능 ●한꺼번에 margin 지정하는 방법 margin: ?px ?px ?px ?px; (상단 오른쪽 하단 왼쪽) ●4면 모두 동일한 여백일때 margin 지정하는 방법 margin: ?px; ●상단, 오른&왼, 하단 순서 margin 지정하기 margin: ?px ?px ?px; (상단 오른&왼 ..
-
[HTML/CSS] border에 대해서....개발자 2021. 6. 1. 18:11
html / css 의 border에 대해서 알아보도록 하겠습니다 border은 content 가장자리의 외부 선을 의미합니다. --border의 구성요소 ●border-width(선 두께) : thin, medium, thick, 또는 픽셀로 지정 ●border-style(선 모양) : none 테두리 없음 dotted 점선 dashed 파선 solid 실선 double 이중 테두리 groove 3D 그루브 테두리 ridge 3D 능선 테두리 inset 3D 삽입 테두리 outset 3D 아웃셋 테두리 ●border-color(선 색상) : 색상이름, rgb(?, ?, ?), #??????로 색상 지정 가능 이 3가지 요소로 각각 따로 border의 디테일을 지정할 수 있지만 한번에 지정도 할 수 있다..
-
자바 이클립스 - 에러메시지 해결방법 1개발자 2021. 3. 29. 22:27
이클립스를 사용해 코딩을 하다보면 다양한 오류메시지를 만나게 됩니다. 자주 발생하는 오류메시지들 영어로 솰라솰라 뭐라고 하는지 잘 모르겠는데요. 그 메시지들은 무엇을 말하는 것이며, 어떻게 해결해야하는지 적어보았습니다. >The local variable " " may not have been initialized -지역변수가 초기화 되지 않아서, 초기화를 해줘야 한다. java.lang.NullPointerException 객체를 정의한 뒤, 생성자를 이용해 생성(인스턴스 생성)하지 않고 그 객체를 사용 할려고 했기때문에 발생하는 에러 -객체 생성해주어야 함 >The constructor System() is not visible -System 클래스의 디폴트 생성자가 접근할 수 없다 >The Syst..