728x90
반응형

Web 9

[WEB : 생활코딩] JavaScript - 15. 비교 연산자와 불리언 ~ 21. 반복문

(51) WEB2-JavaScript - YouTube 유튜브 '생활코딩' 강의를 듣고 정리했다. [ WEB2 - 15. 비교 연산자와 불리언 ] 1. Comparison operator : 비교 연산자 === 동등 비교 연산자, 연산자의 왼쪽에 있는 값과 오른쪽에 있는 값이 같은지를 비교하는 연산자 만약 같다면 true가, 다르다면 false가 출력됨 이항 연산자이다 (좌항과 우항을 결합해서 어떠한 데이터를 만든다.) 2. Boolean 위의 비교 연산자를 통해 만들어지는 true, false 값 3. 데이터 타입 Number : 숫자 String : 문자 Boolean : true, false 4. 조건문에 true가 들어가면 언제나 true이기 때문에 실행문이 반드시 실행되고, 조건문에 false가..

Web 2022.05.29

[WEB : 생활코딩] JavaScript - 9. CSS 기초 : style 속성 ~ 14. 조건문 예고

(51) WEB2-JavaScript - YouTube 유튜브 '생활코딩' 강의를 듣고 정리했다. [ WEB2 - 9. CSS 기초 : style 속성 ] style 속성을 사용하여 디자인에 변화를 줌 : onclick 안에 JavaScript가 오는 것과 마찬가지로 style 속성 안에는 CSS가 온다고 약속 HTML 문법인 style을 통해서 웹브라우저에게 위의 코드가 javascript라는 것을 알려주는 것이고 JS 코드가 style 태그가 위치하는 태그에 적용되어야 함 color:powderblue -> CSS라는 컴퓨터 언어의 문법 중에서 속성(Property) 특정 태그를 CSS 언어로 디자인하고 싶을 때 style 속성을 쓰고 문법을 사용함 [ WEB2 - 10. CSS 기초 (style 태..

Web 2022.05.22

[WEB : 생활코딩] JavaScript - 6. 데이터타입 - 문자열과 숫자 ~ 8. 웹브라우저 제어

(51) WEB2-JavaScript - YouTube 유튜브 '생활코딩' 강의를 듣고 정리했다. [ WEB2 - 6. 데이터타입 - 문자열과 숫자 ] 데이터타입 = 자료형 'javascript data type' 검색을 통해 6개의 데이터 타입이 있고, 객체가 있다는 것을 알 수 있음 [ 오른쪽 버튼 ] - [ 검사 ] - [ 콘솔 ] : alert(1+1); 을 하면 경고창이 뜨는 것을 확인할 수 있다. 숫자들의 연산을 콘솔을 통해 할 수 있다. + : 왼쪽의 값과 오른쪽의 값을 더해 하나의 값으로 만든다. -> 산술 연산자 문자열 : ""이나 ''사이에 문자들이 들어간다. 'Hello world'.length : 를 통해 몇 글자인지 알려준다. 'javascript string' 검색을 통해 문자를..

Web 2022.05.15

[WEB : 생활코딩] JavaScript - 1. 수업소개 ~ 5. HTML과 JS의 만남 (콘솔)

(51) WEB2-JavaScript - YouTube 유튜브 '생활코딩' 강의를 듣고 정리했다. [ WEB2 - 1. 수업소개 ] WEB1 HTML과 연관된 수업 HTML은 정적임, 한 번 화면에 출력되면 언제나 그 모습 그대로임 사용자와 상호작용하는 웹페이지를 만들고 싶다는 욕망 -> JavaScript : 웹은 HTML을 이용해 웹페이지를 우선 만든 후에, JavaScript를 이용해서 사용자와 상호작용 할 수 있도록 기능을 추가함으로써 사용자와 상호작용을 하면서 검색엔진을 통해 검색 가능 = 웹만의 독창적 특성 HTML : 정보라는 멈춰있는 이미지를 그리는 작업 JavaScript : 정보라는 이미지를 영화처럼 움직이게 함 [ WEB2 - 2. 수업의 목적 ] 사용자가 버튼을 클릭했을때, 그에 맞..

Web 2022.05.11

웹페이지 기획 구성

- 주제 : 대바늘이나 코바늘을 통해 만들었던 작품 튜토리얼 or 기초 도안 소개 - 웹페이지 구상 : 평소 취미로 하고 있는 뜨개질 작품들을 정리하고 싶어 제작 - 각 작품들에 대한 튜토리얼 (만드는 과정 설명) : 사진이나 간단한 영상 설명 - 사용된 재료 (실, 바늘, 사용한 부자재) - 재료를 오프라인으로 산 경우 지도 위치 첨부 or 온라인인 경우 링크 첨부 - 참고 서적이나 영상이 있다면 링크로 첨부 -- 가능하다면 공유 할 수 있는 게시물의 형태로 만들 수 있다면 좋을 것 같음 (백엔드 영역이라 이 부분은 이후 계획) 4주차 : 기본적 웹페이지 틀 제작 5주차 : 한가지 작품에 대한 사진과 설명 추가 하는 기능 6주차 : 한가지 작품에 대한 관련 정보(지도 위치, 온라인 링크, 참고 자료 링..

Web 2022.05.08

[WEB : 생활코딩] CSS – 7. CSS 선택자의 기본 ~ 9. 박스 모델 써먹기

(47) WEB2-CSS - YouTube 유튜브 '생활코딩' 강의를 듣고 정리했다. [ WEB2 - 7. CSS 선택자의 기본 ] class라는 그룹으로 묶고, saw라는 속성 값을 주어 ** 우선순위 : id 선택자 > class 선택자 > 태그 선택자 (구체적인 것이 포괄적인 것보다 우선순위가 높음) " css selector " 검색을 통해 여러가지 형태의 선택자 활용 [ WEB2 - 8. 박스 모델 ] box.html 파일에서 작업했다. 인 제목 태그는 화면 전체를 사용하는 반면, 링크 태그는 줄 바꿈을 하지 않고 콘텐츠 크기만큼 사용-> 테두리를 그리면 부피를 알 수 있다. block : 화면 전체를 쓰는 태그inline : 자기 자신의 부피, 콘텐츠 크기만큼 갖는 태그 block과 inlin..

Web 2022.05.08

[WEB : 생활코딩] CSS – 1. 수업소개 ~ 6. CSS 속성을 스스로 알아내기

(47) WEB2-CSS - YouTube 유튜브 '생활코딩' 강의를 듣고 정리했다. [ WEB2 - 1. 수업 소개 ] WEB1과 연관된 수업 목적 : HTML을 이용하면 전자 문서를 만들 수 있다. 더 원하는 웹 페이지를 만들기 위해 CSS가 필요 [ WEB2 - 2. CSS가 등장하기 전의 상황] 웹페이지를 아름답게 만들기 위한 고민이 생김 1. HTML에 디자인에 대한 새로운 태그 추가하기 2. 디자인에 최적화된 완전히 새로운 언어 만들기 (CSS) 방법 1에서 디자인에 대한 태그 를 사용함 (지금은 사용하지 않음) -> 는 해당 글에 대한 어떠한 정보를 가지고 있지 않음, 단지 디자인만 나타내고 있음 (의미가 없음) 정보가 아닌 디자인에 대한 코드가 섞이면서 웹페이지가 정보로서의 가치가 현격하게..

Web 2022.05.08

[WEB : 생활코딩] HTML & Internet - 9. 줄바꿈 : br vs p ~ 18. 웹호스팅 : github page

WEB1- HTML & Internet - YouTube 유튜브 '생활코딩' 강의를 듣고 정리했다. [ WEB1 - 9. 줄바꿈 : br vs p] 'html new line tag' 검색을 통해 줄바꿈 찾기 : 줄바꿈 , 열리는 태그와 닫히는 태그가 따로 존재하지 않음 을 통해 단락 처럼 구분 할 수 있음 'html paragraph tag' 검색을 통해 단락 표현 찾기 : 단락 표현하기 br태그는 단순한 줄바꿈인 반면에, p태그를 사용해 단락의 처음과 끝을 알 수 있다. 이를 통해 단락의 구간을 의미론적으로 표현 할 수 있다. -> 정보로서 더 가치있는 HTML이 된다는 것의 중요성 but br태그는 원하는 만큼 줄바꿈을 할 수 있지만, p태그는 정해진 여백만큼만 벌어짐 이는 css 문법(margin..

Web 2022.05.01

[WEB : 생활코딩] HTML & Internet - 1.수업소개 ~ 8.통계에 기반한 학습

WEB1- HTML & Internet - YouTube 유튜브 '생활코딩' 강의를 듣고 정리했다. [ WEB1 - 1. 수업소개 ] 나의 문제를 코딩으로 해결하려는 엔지니어를 상상하기 해결하려는 문제를 찾기 [ WEB1 - 2. 프로젝트의 동기 ] SQL언어를 알려주는 강의를 시작함 같은 이야기를 반복, 대면이 아닐경우 참석하지 못하는 한계가 있음 HD화질이 생겨 온라인 강의를 시작하는 계기가 됨 [ WEB1 - 3. 기획 ] 무엇인가를 만들기 전에 해당 대상을 1상상하고 2계획하고 3구체화하는 과정 필요 기획 - 설계, 그려보는 과정 코딩수업과 내용을 정리할 수 있는 웹사이트를 기획함 [ WEB1 - 4. 코딩과 HTML ] 사람과 기계가 하는 작업을 분리해서 생각해보기 (어떤 것이 원인이고 결과인지..

Web 2022.04.02
728x90
반응형