비전공자 공부일기/:: WEB & Front-End
-
[JavaScript] 기초비전공자 공부일기/:: WEB & Front-End 2020. 6. 16. 13:29
간단개요 자바스크립트는 동적인 페이지를 표현하기 위한 언어, 동적 제어를 위한 언어이다. 처음 나왔을 때는 각광받지 못했지만, 점점 웹이 무거워지고 동적인 표현들이 필요하게 되면서 최근 자바스크립트가 많이 필요하게 되었다. 자바와 자바스크립트는 이름이 비슷하지만 사실 전혀 다른 언어인데, 자바가 뜨니까 숟가락을 얹기 위해 자바스크립트라는 이름을 붙이게 되었다. 일단 자바는 컴파일 언어인 반면에 자바스크립트는 인터프리터 언어인 것부터 다르다. * ECMA Script ---> 자바스크립트의 표준. 매년 표준안이 나온다. 그러나 업데이트가 빨리 되는편인 건 아님. 자바스크립트 활용 기초 HTML에서 스타일에 대한 제어를 위해서 또는 태그 안에서 document.write("")는 삽입하고 싶은 텍스트를 넣을..
-
[HTML/CSS] 여러가지 자주쓰는 유용한 HTML 태그들 (3)비전공자 공부일기/:: WEB & Front-End 2020. 6. 15. 13:10
ㅁ 요소의 위치에 대한 속성 float : "left, right" --> 왼쪽 또는 오른쪽을 기준으로 요소들이 둥둥 뜬다. 블록태그에서도 visibility : "visible, hidden" --> 영역은 차지하고 있으면서 보이지 않는 것 display : "block, inline, inline-block" --> block태그처럼 쓸지, inline태그처럼 쓸지 설정해줄 수 있다. display : "table-cell" 영역조차 차지하지 않고 사라지는 것 / ㅁ 폰트와 관련된 태그들 font-size : "xx-large, x-large, large, medium(default), small, x-small, xx-small" font-size : "00pt, 00px, 0em" ** 12 pt..
-
[HTML/CSS] CSS 기초비전공자 공부일기/:: WEB & Front-End 2020. 6. 12. 15:03
HTML문서 내에서 CSS의 위치 일반적으로 CSS 속성영역은 태그 안, 태그 아래에 쓴다. 태그 안에 원하는 CSS 코드를 작성하면 된다. 태그명 {} 안에 들어갈 속성이 하나인 경우, 코드 뒤에 ; (세미콜론)을 붙이지 않는 것이 더 맞는 문법이다. color: pink; color: rgb(198, 231, 103); color: #C6E767; background-color:gray; 속성의 우선순위 서로 속성값이 중복으로 들어갈 경우, 우선순위대로 들어간다. 여러가지 활용방법 ㅁ 주석처리 /* */ ㅁ 여러 가지 태그에 한꺼번에 속성부여 가능 ㅁ 클래스 속성 class="value" . * grouping이 목적 : 여러번 중복해 사용할 수 있으므로 무언가 표준안을 만들 때 id보다 더 많이 사..
-
[HTML/CSS] CSS의 이해(개요)비전공자 공부일기/:: WEB & Front-End 2020. 6. 12. 13:42
ㅁ CSS(Cascading Style Sheet) 이해 - 워드프로세스의 스타일 적용과 유사 - cascading: '계단형'의 의미. 스타일 적용에 특정도, 또는 우선순위가 있고 우선순위가 정해지는 것이 계단식 스타일 시트라는 의미 - 필요한 이유: 1. HTML에 직접 스타일을 적용함으로써 생기는 HTML문서 자체의 무거움을 줄일 수 있다. 2. 하나의 스타일로 다수의 페이지에 같은 속성을 적용함으로써 작업시간 단축 3. 웹 표준의 원칙 : HTML 마크업을 통해 구조를 잡고, CSS로 디자인을 입힘 ㅁ CSS의 진화 과정 - W3C을 통해 표준 관리 - 현재 최신 브라우저는 정부 CSS2 규격을 준수 - CSS3도 표준안이 완성되었고 대부분 브라우저에 지원(완벽하게 지원X) ㅁ CSS와 HTML의..
-
[HTML/CSS] 여러가지 자주쓰는 유용한 HTML 태그들 (2)비전공자 공부일기/:: WEB & Front-End 2020. 6. 11. 16:58
목록을 나타내는 태그 : , --- unordered list : 목록들의 앞에 기호가 표시됨(기호모양은 바꿀 수 있음) ordered list : 목록들의 앞에 숫자가 표시됨 목록의 요소들을 적어줌 텍스트를 꾸며주는 태그들 : , , , : bold : italic : highlighting >> style = "background-color: 컬러값"으로 색깔 변경 가능 : bold처리가 되며, 단순 글자강조가 아니라 의미적으로도 강조가 될 때 사용 태그로 문구를 지정해 style 속성으로 하이라이트 효과를 줄 수도 있긴 함. HTML 문서의 구성을 나타내는 태그들 , , , , , : 사이트명, 로고 포함 >> 페이지가 전환되어도 잘 바뀌지 않음 : 사이트의 메뉴 포함(navigation) >> h..
-
[HTML/CSS] 여러가지 자주쓰는 유용한 HTML 태그들 (1)비전공자 공부일기/:: WEB & Front-End 2020. 6. 11. 11:00
자바 웹개발 HTML5로 넘어오면서 기존에 HTML 화면에 표현을 목적으로 하는 태그들은 대부분 CSS쪽으로 옮겨가고, 많이 사라지는 추세이다. 그 중에 아직 남아있는 태그들을 알아보자. 줄바꿈 태그 : 은 시작태그이면서 종료태그의 형태를 취한다. 원래는 위와 같이 슬러시를 표시해주어야 하지만, HTML5로 넘어오면서 슬래시를 표현하지 않아도 오류가 나지 않게 되었다. 따라서 그냥 로만 표기해도 된다. 공백문자 : 공백 또는 여러 특수문자를 사용해야 하는 경우, HTML에서는 앞에 &, 뒤에 ;를 붙여 표현한다. 그 중에서 는 공백을 표현하는 문자이다. 단락 표현 : 기본적으로 block 태그이다. 그러나 그 안의 요소들은 원래 본인의 속성대로(block or inline) 적용된다. 와 의 차이는 p는..
-
[WEB:] XML 파일로 AOP 환경 설정하기비전공자 공부일기/:: WEB & Front-End 2019. 9. 5. 12:53
2019. 09. 05 상속은 is A, 포함은 has A의 관계이다. 횡단관심모듈이 선언된 클래스(Advice)로 Spring Bean 등록\ XML 파일로 AOP 환경 설정하기 aop:pointcut 태그의 속성 중 expression="execution()" 괄호 안에는 execution([접근지정자] 반환형 [패키지명.클래스명.]메소드명(자료형,자료형,...)) 형식으로 작성해준다. [접근지정자]와 [패키지명.클래스명.]은 생략해도 되지만 작성해야할 경우 정확히 입력해준다. 하지만 반환형, 메소드형, (자료형)은 생략할 수 없는 대신, 와일드카드로 간략히 나타낼 수 있다. 다양한 예시>> execution(* *(..)) 일 경우 : 모든 메소드가 대상 execution(* *(int))일 경우 ..
-
[WEB:] AOP와 OOP의 차이비전공자 공부일기/:: WEB & Front-End 2019. 9. 4. 17:12
2019. 09. 04 지금까지 자바는 객체지향 프로그램이라는 말을 많이 들어보았을 것이다. OOP가 바로 지금까지 우리가 잘 알고 있는 [객체지향 프로그램]으로, Object Oriented Programming의 준말이다. 한편 AOP는 Aspect Oriented Programming의 준말로, 한국어로는 [관점지향 프로그램]이라고 한다. 애플리케이션의 핵심적인 기능과 부가적인 기능을 분리해, Aspect라는 모듈로 만들어 설계하고 개발하는 방법이다. 그러나 이 둘은 상반되는 개념이 아니다. 오히려 OOP를 더욱 OOP답게 사용할 수 있도록 하는 게 AOP이다. 기존 포함관계를 사용하던 방식을 상속 방식으로 사용하게 한다. 자기가 모든 기능을 가지고있어야 하는데 기능 갖고 있는 다른 클래스를 포함시..
-
-