웹언어 (193) 썸네일형 리스트형 [7/5] HTMLCSS파일공유 보호되어 있는 글입니다. [HTML5] 24강 SEO(검색엔진최적화)관련 meta태그 ** 유튜브로 보실분은 아래 주소를 클릭해주세요.https://youtu.be/CcOK0tJ1CPA 1. SEO(검색엔진최적화)란?- SEO는 Search Engine Optimazation의 약자로, 구글과 같은 검색엔진에 친화적인 사이트를 구축하는 것을 말합니다.- 검색엔진최적화작업을 하면 광고가 아닌 자연 검색 결과를 통해 트래픽의 양과 질을 극대화할 수 있습니다. - 물론 광고를 통해 검색 시 상단에 뜨게 할 수 있습니다.- 하지만 광고로 형성된 상단의 검색결과보다 자연 검색결과로 이루어진 첫 번째 사이트가 대부분의 클릭률을 가지고 간다고 합니다. - 위의 이미지를 구글에서 코딩학원을 검색한 결과입니다. - 중간에 스폰서와 동영상부분은 좀 잘랐습니다.- 스폰서를 2개만 뒀는데, 저것이.. [이클립스] 이클립스 프로젝트 자동업데이트 되도록 처리 - 이클립스를 처음 설치하면 Project Explorer가 자동으로 업데이트되지 않아서 매번 [F5]눌러서 새로고침해야 합니다. - 그래서 자동으로 새로고침하는 법을 보겠습니다. 1. [window]메뉴 설정 가기 - [window]-[preferences]메뉴로 들어갑니다. 2. 자동 설정 체크하기 - [General]-[Work Space] 카테고리를 눌러 줍니다. - [Refresh using native hooks or polling]이 미체크되어 있다면 체크해줍니다. [Git&GitHub강좌] 3강 GitHub DeskTop 사용법 - 오쌤의 니가스터디 - Git과 GitHub를 터미널에서 사용하려면 매번 명령어를 쳐야 하는 불편함이 있습니다. - 하지만 쉽게 해주는 프로그램이 있겠죠? - 그게 바로 Github Desktop입니다. - GitHub Desktop을 사용하려면 미리 Github사이트 회원 가입을 해줘야 합니다. https://github.com/ GitHub: Let’s build from here GitHub is where over 100 million developers shape the future of software, together. Contribute to the open source community, manage your Git repositories, review code like a pro, track bugs an.. [ES6강좌] 15강 CustomEvent 제작하기 - 오쌤의 니가스터디 - 커스텀이벤트는 자바스크립트가 미리 갖고 있지 않은 이벤트를 개발자가 만드는 것을 말합니다. - 자바스크립트는 클릭(click), 마우스관련(mouseenter 등)의 이벤트를 내장하고 있습니다. - 하지만 개발하다보면 내장된 이벤트 외에 이벤트를 만들어야 하는 경우가 있습니다. - 이처럼 자바스크립트가 내장하고 있지 않은 이벤트를 만드는 것이 Custom Event입니다. 1. 커스텀이벤트 생성하기 - 커스텀 이벤트를 생성하는 방법은 2가지가 있습니다. const 인스턴스변수명 = new Event(type, options); const 인스턴스변수명 = new CustomEvent(type, options); - 그럼 2개의 차이를 봐야겠죠? 일단 간단하게 먼저 설명해 보겠습니다. - CustomE.. [ES6강좌] 14강 Fetch API사용하기 - 오쌤의 니가스터디 - Fetch API를 사용하면 웹 브라우저가 웹 서버에 HTTP 요청을 할 수 있습니다. - 2015년~2017년 사이 모든 브라우저가 Fetch API를 지원하므로 더 이상 XMLHttpRequest가 필요하지 않습니다. 1. REST API - REST API는 웹 주소를 이용하여 서버와 통신하는 방법 중 하나라고 보면 됩니다. - 주소를 입력하는 방법으로 데이터를 생성, 요청, 변경, 삭제를 할 수 있습니다. - 그래서 우리는 REST API의 4가지 함수를 보도록 하겠습니다. 1) REST API 함수 REST API함수 설명 CRUD표현 주소입력방식 POST 데이터 등록 Create /test GET 데이터 조회 Read /test 또는 get/test/4 PUT 데이터 수정 Update /t.. [Svelte강좌] 11강 Bindings - Each Block - 오쌤의 니가스터디 1. Each Block 바인딩(Binding)이란? - 바인딩은 상태 값과 그 값을 제어하는 요소와의 결합을 의미합니다. - 보통 데이터를 입력하는 다양한 폼(input, select, textarea 등)과 함께 사용됩니다. - 하지만 다른 요소들에도 사용할 수 있습니다. - 이번에는 each block 관련으로 보고자 합니다. - each block은 반복 로직에서 사용합니다. 그러다 보니 다양한 작업들을 합니다. - 지난 강좌에서 select태그의 옵션 태그때문에 사용은 했었습니다. - 워낙 each block은 많이 사용하기 때문에 다시 정리하고 넘어가도록 하겠습니다. - 이번 강좌에서는 간단한 버킷리스트를 제작해보도록 하겠습니다. 1) 마크업 구조 확인하기 - svelte의 바인딩기능이 아직 .. [Svelte강좌] 10강 Bindings - textarea, select요소 - 오쌤의 니가스터디 1. 바인딩(Binding)이란? - 바인딩은 상태 값과 그 값을 제어하는 요소와의 결합을 의미합니다. - 보통 데이터를 입력하는 다양한 폼(input, select, textarea 등)과 함께 사용됩니다. - 지난 강좌에서는 input요소들만 봤는데, 이번에는 select태그와 textarea태그의 바인딩을 보도록 하겠습니다. ## 문법 - 보통 위의 형태로 작성한다고 보면 됩니다. 1) textarea value 바인딩 - textarea태그 요소는 여러 줄 입력상자입니다. - 원래 HTML에서는 입력되는 값은 태그 사이에 텍스트 컨텐츠를 통해 작성했습니다. 안녕하세요 - 의 한 줄 입력상자인 text처럼 value속성을 통해 값을 바인딩 시켜줍니다. - 그래서 bind:value로 작성하면 됩니다.. 이전 1 2 3 4 ··· 25 다음
