전체 글

Java 문법(1) - 시작

Java? JDK? J2SE? J2SE(Java 2 Standard Edition), J2EE(Java 2 Enterprise Edition), JRE(Java Runtime Environment), JDK(Java Development Kit) ⇒ 자바 플랫폼을 사용한 개발 혹은 실행을 위한 API **플랫폼: 특정 소프트웨어를 구동할 수 있는 갖추어진 공간 **API: 프로그램 작성을 위한 도구의 모음(함수, 라이브러리 등) **라이브러리: 소프트웨어를 개발할 때 유용하게 사용할 수 있는 변수, 함수 등의 모음 자바의 특징 Garbage Collector: 메모리에 다양한 데이터 값을 넣고 삭제하는 작업을 하면서 메모리가 지저분해지는 경우가 발생. java는 자동 메모리 정리 기능을 갖고 있음 JVM..

Java 2022.02.06

CSS - body의 height가 이상해요!(+ footer 하단 고정 안됨)

개발을 하는 도중... footer를 페이지 가장 하단에 고정시키고 싶은데 자꾸 어중간한 위치에 있는 것이다.. (페이지 중간쯤?) body, html의 height를 100%, footer를 postion: absolute하고 bottom: 0을 해놓은 상태인데도 말이다. 페이지를 개발자 모드로 봤더니 화면 전체크기가 1519x742로 설정되어 있는 것이다.(높이는 개발자 모드로 인해 좀 작아진 상태) '읭? body의 height를 분명 100%설정했고, 스크롤도 될 정도로 height가 꽤 되는데 height가 왜 742밖에 안되지???' 결론은 position: absolute 때문이었다. position 값을 주면(static제외) 레이아웃이 달라져(z-index 자연스래 적용돼서) height..

HTML & CSS 2022.01.23

javascript | 다중토글 구현하기 - forEach, toggle

See the Pen 다중토글 by sanghee01 (@sanghee01) on CodePen.forEach를 이용해 모든 토글들에게 기능을 적용시킨다.(매개변수 이름은 tog라 지었다)각 토글(tog)이 click 이벤트를 받을 시,만약 현재 내용이 안보인다면 내용이 보이도록 show class ( display:block )를 넣고내용이 보인다면 안보이도록 show class를 제거한다. (default는 css에서 display:none처리를 했다)이 기능은 element.toggle( )를 이용하였다.  cont같은 경우 tog.nextElementSibling이라 작성하였는데,클릭한 tog의 cont 값을 가져오고 싶어서 이렇게 작성하였다.  Element.classList - Web API..

JavaScript 2022.01.20

터미널 명령어 정리 (Window powershell)

Window powershell 7.2.1 기준 터미널 명령어 정리  *powershell은 cmd와 달리 운영체제 모든 터미널에 접근할 수 있어서 좋다.  사용자 메뉴얼 명령어man {명령어} Manual 약자어떤 옵션들이 있는지 보고 싶을 때 사용get-help와 역할 동일설명에서 나가고싶으면 '단축키 q' 를 누르면 된다.ex) man clear => clear에 대한 설명 나옴  clear터미널 내용 지우기   파일 시스템 탐색 명령어pwdPrint Working Directory 약자현재 나의 경로를 알 수 있음 lslist의 약자현재 경로에 어떤 파일과 폴더가 있는지 목록을 확인할 수 있음 특정 폴더 안 내용 보고싶으면 'ls {경로}' 또는 'ls {폴더}'-name : 이름만 보고 싶을 때..

웹 프론트(4) - HTML tag

이번 시간에는 기본적인 HTML tag를 알아볼 것이다.  제목 Tag크기에 따라 ~으로 나뉜다. 본문 Tag : 단락 or 문단 : 형식화된 텍스트 : 줄바꿈 수행그 외에 등이 있다  글자 Tag : 볼드체 : 이탈릭체: 문장을 위로: 문장을 아래로: 밑줄 : 취소선  링크 Tag : 하이퍼 링크의 역할을 수행href(Hypertext Reference) 속성 : 웹 사이트 주소를 정한다.target 속성 : 링크를 클릭했을 때, 해당 페이지를 어떻게 열 지 정한다._self: 현재 탭에서 링크를 연다_blank: 새 탭 or 새 창에서 링크를 연다.'상추의 tistory'를 누르면 새 탭에서 href 속성에 지정한 주소로 이동한다.   이미지 Tag : 이미지 넣고 싶을 때 사용 (종료 태그가 없다..

HTML & CSS 2022.01.09

웹 프론트(3) - HTML 구조

HTML 구조 다음은 기본적인 html 코드이다. 뭐가 뭔지 모르겠어도 한번 직접 분석해보자. Hello world! 크게 보면 태그 안에 , 로 나뉘어져 있다. 대체적으로 태그들이 열고 닫는 형태임을 볼 수 있다. 태그 처럼 그냥 혼자로만 닫는 태그(self-closing tag)도 있다. 몇몇 태그에는 부가적으로 속성이 있는걸 볼 수있다. 예를 들어 태그는 이렇게 lang이라고 부가적으로 붙는 게 있다. 이런걸 속성(attribute) 라고 부른다. 코드를 순서대로 분석해보자면 : '이것은 html문서다!' 라고 알려주는 역할이다. 첫 라인에 필수적으로 넣어준다. : html코드의 시작점. lang속성은 검색엔진에게 주된 사용언어를 알려준다. (한국어: ko, 영어: en, 일본어: jp ...) :..

HTML & CSS 2022.01.08

Github 잔디가 안심어지는 현상

organizations로 협업하는데 여기 repository에서만 commit하고 push를 하면 잔디가 안심어지는 현상이 일어났다. 먼저 내가 해결책을 찾는 과정은 이랬다. 1. 프로필에 있는 Contribution settings에 Private contributions가 체크 되어있는가? 이것이 체크 안되어있으면 Private가 되어있는 repo는 잔디가 안심어진다. 하지만 나는 여기에 있는 두개 다 체크를 해봐도 해결되지 않았다. 2. git repository email주소와 local email 주소가 같은가? 확인해보니 같았다... 다르면 심어지지 않는다. 3. 아래 방법은 fork한 repo에서도 잔디를 심을 수 있게 해주는 방법이다. 나는 fork한 repo가 아니지만 일단 해보았다. ..

웹 프론트(2) - 웹사이트를 구조화하는 연습을 하자

웹사이트 구조 우리들이 흔히 보는 웹페이지는 이런 식으로 구성되어있다. (물론 무조건 aside가 무조건 있고 footer가 있는 건 아니다. 대략 이런식으로 구성되어 있다) 밑에 예시를 보자 대충 맨 위 색깔과 맞춰서 구분지어 놨다. 여기서 더 분할할 수 있고, 정답은 없다. 뭐든지 box model로 세분화해서 나눠보는 연습을 하는게 좋다. 여기서 box는 sectioning이 되는 것을 말한다.

HTML & CSS 2022.01.06

웹프론트(1) - HTML/CSS/JS 의 정의 및 역할

웹사이트는 text 파일이 만든다.text 파일이 브라우저에게 코드를 전달하고, 브라우저가 그 코드를 이해하고 구현해서 사용자에게 출력하는 것이다.웹사이트(프론트)를 만들 때 사용되는 언어는 HTML, CSS, Javascript가 있다.  HTML이란?HTML은 HyperText Markup Language 의 약자로 말 그대로 '컨텐츠의 구조를 정의하는 마크업 언어'이다.컨텐츠(내용)에 태그(마크)를 씌워 구조를 구분하여 정의한다.브라우저는 멍청해서 사람들이 사용하는 언어를 이해 못한다. 즉, 우리의 웹사이트/Content를 이해 못한다.우리가 해야 할 일은 브라우저에게 Content가 무엇인지 알려주는 것이다. (ex. title은 무엇이고, link가 무엇이고, 이건 이미지, 제목이야 등등...)..

HTML & CSS 2022.01.06