분류 전체보기
-
[TIL] Today I Learned : for문 - findSmallestElement 함수프론트엔드 개발자가 될거야./js 2022. 6. 22. 20:38
많이 공부했다고 생각했는데... 문제 푸는데 많이 막혔다! 먼저, for문에 대해 알아보자. for문 for 문을 사용하면 코드를 원하는 만큼 반복시킬 수 있다. 실행 조건에 따라 언제부터 언제까지 반복하게 될 것이라고 알려주면 된다. 반복문 내의 조건문 반복문과 조건문은 함께 많이 쓰인다. 잘 이해해두어야 한다! 예시를 함께 보자. const home = "대전"; let cities = ["서울", "대전", "대구", "대전", "광주", "대전"]; for (let i = 0; i < cities.length; i++) { if (cities[i] === home) { console.log("아, "+ cities[i] +" 사시는군요"); } } for (var i = 0; i*
-
레이아웃의 모든 것프론트엔드 개발자가 될거야./htmlcss 2022. 6. 21. 16:16
1. position 속성 - relative, absolute, fixed 2. inline, inline-block, block 1. position 속성 - relative, absolute, fixed position 에서 사용하는 값은 4개가 있는데 static 은 거의 사용하지 않아서 relative, absolute, fixed를 정리해보았다. relative relative는 position: relative; 자체로는 특별한 의미가 없다. top, right, bottom, left 프로퍼티가 있어야 힘을 발휘한다. 위치를 이동시켜주는 top, right, bottom, left 프로퍼티가 있어야 원래의 위치에서 이동할 수 있는 것이다. top, right, bottom, left 는 p..
-
Semantic Web과 Semantic Tag프론트엔드 개발자가 될거야./htmlcss 2022. 6. 20. 22:18
Semantic Web이란? : 의미를 가지는 웹 일반 웹은 컴퓨터가 정보를 알지 못하지만 semantic web은 컴퓨터가 정보를 알 수 있다. 웹에 존재하는 수많은 웹페이지들의 잡다한 데이터 집합에 의미와 관련성을 지니는 메타데이터를 부여하여 거대한 데이터베이스를 구축한 것이다. 메타데이터 : 다른 데이터를 기술하기위해 사용되는 언어 : 특정 데이터를 검색엔진으로 쉽게 찾아낼 수 있으며 데이터를 사용하는 사람의 눈에 보이지 않고, 컴퓨터가 이용함 왜 생겨났을까? 인터넷이 활성화되면서 웹의 사용이 폭발적으로 늘어났다. 이토록 복잡하고 고도의 동적인 웹 공간에서 지식을 믿을 만하게 검색, 관리하고 웹 장치들과 인간이 교류하기 위해서는 정보의 의미 처리가 필수적이게 되었다. 따라서 의미 정보를 자동적으로 ..
-
[위코드 35기 precourse-html-css] 위코드 첫 날, htmlcss 총정리, 배운 내용 복습프론트엔드 개발자가 될거야./htmlcss 2022. 6. 20. 21:45
들여쓰기, 띄어쓰기 (스페이스바 기능) 방법1   방법2 => text-indent 을 이용 .js-description { text-indent: 50px; } 밑줄긋기 p { text-decoration: underline; } 이처럼 text-decoration를 이용한다고 알고있지만 밑줄의 두께나 색깔 등, 완벽하게 커스터마이징 하기가 어렵다. 그래서 내가 원하는 스타일로 밑줄을 칠 수 있게 border-bottom으로 구현하는 것을 더 선호해야한다. CSS selector 표현 p.p-tag => p태그 이면서 p-tag클래스 .pre span => pre클래스 내부에 있는 span태그 .a div .b .pre span => a클래스 내부에, div태그 내부에, pre클래스 내부에 있는..
-
[노마드 코더] 바닐라 JS로 크롬 앱 만들기프론트엔드 개발자가 될거야./js 2022. 6. 19. 18:03
listen하고 싶은 event를 찾는 가장 좋은 방법 console.dir(h1); 메소드 & element의 내부를 볼 수 있음. 이벤트도 알 수 있음. -> on만 빼면 됨 className, classList, toggle의 사용 (feat. css는 css에서!) - className의 버그 : 이전의 class들은 상관하지 않고 모든걸 교체해버림 => 이것을 해결한 것이 classList - classList => clsaaList의 코드를 한 줄로 해결한 것이 toggle // css .clicked { color: red; } // JS if(h1.classList.contains("clicked")) { h1.classList.remove("clicked"); } else { h1.cla..
-
[모두의 네트워크] 7장 응용 계층 : 애플리케이션에 데이터 전송하기CS지식 2022. 6. 16. 12:16
28. 응용 계층의 역할 OSI 모델의 7계층인 응용 계층 - 응용 계층 역할 = 애플리케이션이 동작하는 계층 웹 페이지를 볼 때는 인터넷 익스플로러 같은 웹 브라우저를 사용하고 메일을 보내고 받을 때는 Outlook같은 메일 프로그램을 사용한다. 이렇게 애플리케이션은 사용자가 하고 싶은 일을 할 수 있도록 도와준다. 애플리케이션은 서비스를 요청하는 클라이언트와 서비스를 제공하는 서버로 분류할 수 있다. 서비스를 요청하는 클라이언트 = 웹 브라우저, 메일 프로그램 서비스를 제공하는 서버 = 웹 서버 프로그램, 메일 서버 프로그램 물리 계층, 데이터 링크 계층, 네트워크 계층, 전송 계층 = 상대방에게 데이터를 정확하게 전달할 수 있다. 응용 계층 = 애플리케이션과 데이터를 주고받기 위해 필요하다. = 클..
-
[모두의 네트워크] 6장 전송 계층 : 신뢰할 수 있는 데이터 전송하기CS지식 2022. 6. 16. 11:44
23. 전송계층의 역할 OSI 모델 4계층인 전송 계층 네트워크 계층 : 다른 네트워크로 데이터를 전송하려면 라우터가 필요, 라우터의 라우팅 기능을 사용하여 전송. 만약, 라우팅 정보가 잘못되었거나 많은 라우터를 경유하는 도중에 라우터에 문제가 생기거나 패킷이 손상될 수도 있음 물리 계층, 데이터 링크 계층, 네트워크 계층의 3계층이 있으면 목적지에 데이터를 보낼 수 있지만 데이터가 손상되거나 유실되어도 이 계층들에서는 아무것도 해줄 수 없음 네트워크 계층은 목적지까지 데이터를 전송하고 전송 계층은 데이터가 제대로 도착했는지 확인하는 역할 - 전송 계층의 역할 : 목적지에 신뢰할 수 있는 데이터를 전달하기 위해 필요 1. 오류를 점검하는 기능 2. 전송된 데이터의 목적지가 어떤 애플리케이션인지 식별하는 ..
-
HTML input checkbox프론트엔드 개발자가 될거야./htmlcss 2022. 6. 15. 17:17
// 복수 선택 가능한 체크박스 // 단일 선택 체크박스 이름 삽입 시 태그를 사용하면 글씨 영역을 클릭해도 checkbox 영역이 클릭 된다. 방법 1 오늘 할 일 방법 2 오늘 할 일 체크 박스 그룹 지정 여러 체크 박스를 하나의 그룹으로 지정하고 싶을 때, name 속성을 같은 값으로 지정하기 공부하기 잠자기 카페가기 체크박스 checked/unchecked 기본 설정은 unchecked이고 특정 체크박스에 체크 표시를 하고 싶으면 checked 속성명 삽입하기