html, css, JavaScript 8

Webpack 공식 홈페이지 : https://webpack.js.org/ 웹팩을 설치하기 위해서는 진행하고 있는 프로젝트를 node.js의 패키지 프로젝트로 만들 필요가 있다. $ npm init 모든 HTTP 요청에는 베이스 오버헤드(base overhead), 지속(duration)이 발생한다. 실제 파일 다운로드는 비교적 빨리 진행되지만, 요청(request)을 설정하고, 서버에서 수행되는 것은 시간이 다소 걸리게 된다. 로컬 개발(local development) 서버에서 모든 것들은 우리 머신(machine) 상에서 이루어지고 있기 때문에 설정(setup)은 빠르게 진행되지만, 웹에서 실행하는 경우 이렇게 다수의 요청이 있다면 HTTP 요청의 양만으로 인해 다량의 대기시간이 발생하고 프로젝트가..

1. truthy & falsy 불리언 값을 넣지 않아도 참이나 거짓으로 인식하는 속성 truthy | [], {}, "비어있지 않은 문자열", 숫자, Infinity falsy | null, undefined, 숫자 0, NaN, 빈 문자열 "" falsy를 이용한 객체 확인 반환 함수 const getName = (person) => { if (!person) { return "객체가 아닙니다."; } return person.name; }; let people; const name = getName(people); console.log(name); // 만약 people에 값을 할당하지 않았거나 null이라는 값을 넣는다면 || 연산자로 하나하나 다 조건문을 지정해 주어야 한다. if(person ..

함수 선언식 함수 표현식 즉시 실행 함수 화살표 함수 콜백 함수 함수 선언식 함수의 이름을 지정해서 사용하는 방법. 함수 호이스팅이 가능하다. function printHello (hello) { return hello; } console.log(printHello("안녕")) "안녕"; // 함수의 이름을 지정하지 않아도 되며 출력 결과가 간단할 경우 중괄호를 쓰지 않아도 된다. // 중괄호를 쓰지 않는다면 return도 작성 x console.log(hello());

addEventListener 출처 : https://abc1211.tistory.com/201 [길위의 개발자:티스토리] 버블링 출저 : https://mygumi.tistory.com/315 [마이구미의 HelloWorld:티스토리] ※ 이벤트 리스너 이름은 이벤트 이름 앞에 ‘on’을 붙이지만, addEventListener로 사용하면 on 없이 사용. UI 이벤트 | 사용자가 웹페이지가 아닌 브라우저의 UI와 상호작용할 때 발생 load 웹 페이지의 로드가 완료되었을 때 unload 웹 페이지가 언로드 될 때(새로운 페이지를 요청한 경우) error 브라우저가 자바스크립트 오류를 만났거나 요청한 자원이 없는 경우 resize 브라우저의 창 크기를 조정했을 때 scroll 사용자가 페이지를 위아래로..

HTML 닫는 태그 없이 쓰이는 태그들 | , , , , , 2em은 기본크기의 2배라는 뜻 멀티미디어와 관련된 태그들 img | 이미지 a | 링크 iframe | 외부 동영상 링크를 가져옴 video | 내 컴퓨터의 동영상을 가져옴 audio | 음성파일. 내 컴퓨터의 음성파일을 가져옴 텍스트와 관련된 태그들 (의미x) div style span | 일반적인 텍스트 p | 단락 pre | br태그 없이 텍스트를 그대로 표현하고 싶을 때 (ex. 시) strong | 중요한 컨텐츠 강조 table(표)와 관련된 태그, attribute들 table | 표를 만드는 태그 tr | 가로줄 td | 칸 th | 셀 안의 글자를 굵게. 제목처럼 보이게 한다. caption | 하나만 가질 수 있음. 표의 제목..

노마드 코더의 코코아톡 클론코딩 강의를 듣기 시작했다. 챌린지도 접수 완료! 챌린지 시작 전까지 예습하고, 테마라던가...? 생각해보면 좋을 것 같다. 참고 사이트는 w3school보다는 mdn을 사용해라 검색어 : html tags mdn HTML : Markup(content) Language CSS | 디자인과 스타일을 위한 언어 JavaScripte | 프로그래밍 언어. 웹사이트를 동적으로 만들어줌 list 리스트 태그 안에 따로 로 만들어줘야 함 ol(ordered list) | 순서가 있는 리스트. type으로 목차 첫 머리의 스타일을 바꿀 수 있다. ul(unordered list) | 순서가 없는 리스트 a | anchor(닻) href | HTTP reference 혹은 hyperlink..

○개발자를 위한 Windows 셋업 강의 (반쯤 듣다가 말았다... 유튜브 생활코딩 강의만 들었던 나에게는 리눅스의 개념도 잘 모르겠고, 그냥 Visual Studio Code를 설치하고 보기 편하게 커스터마이징 한 것으로도 괜찮았던) pwd는 현재 위치 리눅스 root에서 mnt로 진입하면 윈도우로 들어가게 되는 것. 보통은 home/사용자명(sognociel)로 들어가 있음. 권장하는 건 파일들을 윈도우에 저장해 놓는 것. 다만 윈도우에서 리눅스 파일을 건드리지 말 것. ○바닐라 JS로 크롬 앱 만들기 JavaScript는 HTML을 읽어오는 것이다. 읽어오는 것뿐만 아니라 HTML을 변경할 수도 있다. const = 변수 값 바꿀 수 없음 let = 변수 값 바꿀 수 있음 (let myName="n..

생활코딩 사이트 강의 내에서 알려주신 사이트 최초의 웹사이트 Advanced WEB RANKING HTML Study : html 태그들이 사용되는 랭킹 DISQUS : 댓글기능 추가 tawk.to : 실시간 채팅 기능 추가 caniuse : html 태그들이 각각의 웹 브라우저에서 지원되는지 알려줌 HTML, CSS는 컴퓨터 언어 JavaCcript는 컴퓨터 프로그래밍 언어 프로그램 : 순서. 프로그래밍 언어는 순서를 만드는 언어. 만들어진 웹에 자바스크립트를 이용하여 사용자와 상호작용할 수 있게 만듦. ★WEB1 - HTML & Internet 나의 문제를 코딩으로 해결하려는 엔지니어. 이해력보다 공감력이 중요함 기획-구현의 단계를 거친다. 무엇인가를 만들기 전에 무엇을 만들 것인가를 미리 상상하고 ..