티스토리

aait2020
검색하기

블로그 홈

aait2020

aait2020.tistory.com/m

GA관련 초보자 스터디입니다

구독자
4
방명록 방문하기

주요 글 목록

  • 4.html-컨트롤 (form,input,button태그) @@@@해당 내용은 강의 내용바탕으로 메모용도인 점 참조 부탁드립니다@@@@ @form태그 전체 폼의 부모역활(웹상에서 입력 항목을 구상할 때 사용하는 태그) (1)action 속성 >>>값 전송시 자동호출될 서버프로그램 주소지정 (2)method 속성 >>>전송에 필요한 http방식 설정(get, post) >>>> @input 태그 웹상에서 입력항목을 구성할 때 사용하는 태그 (1)type 속성: 속성의 값에 따라서 다양한 입력폼구성 ex) (2)name 속성: 속성의 값은 데이터 전송시 데이터의 식별자로 사용됨 ex) (3)value 속성: 우리 눈에 기본적으로 보여지는 값(로그인, 글쓰기..) ex) (4)password 속성: 입력 시 입력되고 있는 글자가 다른문자(*)로 대체 (5)radio .. 공감수 0 댓글수 0 2023. 5. 1.
  • 3.데이터 전송방식 (head,body/ get,post방식) @@@@해당 내용은 강의 내용바탕으로 메모용도인 점 참조 부탁드립니다@@@@ @HTTP (header와 body로 이루어져있음) (1)header -요청방식(method)알림, 사용자정보, 브라우저정보 등 제공 (나랑 대화할래?) (2)body -서버에 데이터를 전송할 때 데이터가 담겨지는 부분 (대화 내용의 요청과 응답) 1. : 문서에대한 정보 (meta태그나 css코드등 보통여기에넣음) 2. : 본문내용(화면에보이는 내용) 1) : top영역 2) : 네비게이션(lnb, gnb) 3) : 본문내용 - 화면설계서에 contents영역 4) : bottom영역 header,nav,article,footer 등은 이건 body뿐아니라, css 등에서도 의미론적으로 사용할수 있음. 또한 코딩스타일마다 다를.. 공감수 0 댓글수 0 2023. 5. 1.
  • 2.HTML속성 (속성/A태그/엠티 엘리먼트/식별자) @@@@해당 내용은 강의 내용바탕으로 메모용도인 점 참조 부탁드립니다@@@@ @속성(설정값) 콘텐츠 @a태그 콘텐츠 >>>콘텐츠에 대한 하이퍼링크 지정가능 네이버 >>>네이버 클릭 시 해당 url로 이동 @empty 엘리먼트 -쌍을 이루지 않는 태그 >>>닫는 태그 없음 *대표적 태그 (1)br태그 태그가 대표적임 (줄바꿈) (2)img태그 >>>>이미지 파일 적용하는 태그 (연결주소는 이미지의 주소>그럼 해당 url에 있는 이미지를 끌고와서 사이트에 바로 보여짐) @식별자 1)”유일한” 요소 식별자 (하나의 페이지의 유일한 요소의 식별자 역할) 콘텐츠 2)”다중” 요소 식별자 (하나의 페이지의 다중 요소의 식별자 역할) 콘텐츠 공감수 0 댓글수 0 2023. 5. 1.
  • 1.HTML구조 (태그/HTML5/기본구조/포함관계) @@@@해당 내용은 강의 내용바탕으로 메모용도인 점 참조 부탁드립니다@@@@ @HTML (HyperText Markup Languge) @태그언어 -기본구조: 내용 -종류: 등 -엘리먼트: 내용 이 자체를 엘리먼트라고 부르자 @HTML5 -버전이름(버전1~5) > 버전5라는걸 알려주려면 > 이라고 코드 가장 처음에 표시해주면 HTML5라는걸 브라우저에게 알려주는것임 (즉, 웹표준이라는걸 알려주는것임) @@@@@6강~7강@@@@ HTML 구조 @HTML 탬플릿 (기본적인 틀) 안녕하세요. >>>실제 표시될 컨텐츠들 작성 제목입니다 문단입니다 @태그의 포함관계 -엘리먼트 안에 또다른 엘리먼트를 작성하기 위한 관계 (html태그 안에 body태그 안에…) @HTML관계 -부모, 나, 형제 등 관계 -div(부.. 공감수 0 댓글수 0 2023. 5. 1.
  • [JS-자바스크립트] 7.객체 (기본문법(객체,속성,메소드)/ 반복문 / 내장객체-object, number, date, math, DOM, BOM……) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ [1]객체란? 1.객체를 사용하는 이유는? - 함수처럼 코드를 정리하기 위함(중복제거 등) > 함수보다 더 상위개념 - 함수로 처리가 부족할 때에도 객체 사용(이미 함수로 만들어놨는데, 당연히 기억못해서 동일한 함수명으로 만들면 중복되면서 그 이전게 작동안함) > 이때 “객체명.~~~~” 객체명으로 1depth 정리가능 - 배열은 순서 있이 나열하지만, 객체는 순서 없이 나열가능 배열: var 변수명 = [“값”, “값”]; 객체: var 객체명 = {속성:값, 속성:값}; 2.객체 개념 예를들어) 고양이 객체: 고양이 속성(고유한 특징): 색,성별,크기가 모두다르고 메소드(고유한 행동): 냐용, 냥펀치 (객체 내 함수를 활.. 공감수 0 댓글수 0 2023. 5. 1.
  • [JS-자바스크립트] 6.함수- 매개변수(파라미터),인자(아규먼트),리턴 @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ [1]함수를 쓰는 이유는? - 중복제거: 코드 하나를 변경해야하는데 해당 코드가 몇천개 가져다 활용되서 사용되었음 > 그럼 코드 하나(예를들어 색상)바꾸려면 몇천개 모두 바꿔야함 > 이때 함수 활용 - 반복적이지만 연속적이지 않다면 > 반복문 활용하기 힘듬 > 이때 함수 활용 - “잘 정리해서 가져다 사용하는거” 함수. 더 큰단위로 객체도 있음 [2]함수 기본문법 1.기본문법 Function 함수명(매개변수){ 실행코드 return 반환값; } >>>>그리고나서 해당 함수 사용할곳에 함수명(this); 이렇게넣으면 동일하게 사용됨 >>>>그러면 코드변경할 때 함수에 지정한 1개 부분만 변경하면 모두 동일하게 변경됨 2.반복문.. 공감수 1 댓글수 0 2023. 5. 1.
  • [JS-자바스크립트] 기타. 내장객체 (날짜 / getelements / location.속성) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ ____________________문법개요_____________ 1.날짜_____________________ 1)특정시간 지정 document.write(new Date(2020, 09, 26, 18, 30, 00); 2)현재시간 불러옴 var date = new Date; document.write(date); document.write(getFullYear()); document.write(getMonth()); document.write(getDate()); document.write(getHours()); document.write(getMinutes()); document.write(getSeconds()); .. 공감수 0 댓글수 0 2023. 4. 23.
  • [JS-자바스크립트] 5.배열과 반복문(while, for문) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ [1]배열 (1)만드는 방법 [배열값1, 배열값2] >>변수에 담아보자 Var 변수명 = [“bong”, “bae”]; (2)가져오는 방법 >>>> 0은 > 배열 1번째 값을 가져옴 (3)들어있는 값이 몇 개인지 계산 >>>>배열이 2개이니 > 값은 2가 나옴 (4)배열 데이터 추가 >>>데이터를 끝에다가 추가 (5)기타 기능들은 검색 데이터를 중간에 넣거나, 처음에 넣거나 하는 것등은”javascript array”로 검색하면 여러가지 기능이 나옴 [2]반복문 (1)반복문 사용되는 예시 1)프로그램은 아래와 같이 기본적으로 순서대로 실행됨 2)그런데 만약 중간에 부분을 반복해서 여러 번 실행시키고 싶다면 이때 반복문 활용 .. 공감수 1 댓글수 1 2023. 4. 23.
  • [JS-자바스크립트]4.중복제거 (THIS활용, 변수var활용) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ [1]중복제거 1.this 활용 Night, day 버튼 다른데서 또 사용하려면 아래와 같이 id값을 바꿔줘야함 (그렇지 않으면 작동은 하지만, 버튼명이 본인이 아니고, 위에 있던 버튼이 변경됨) 이때 아래처럼 this 사용하면됨 > 이건 어디에서든 그냥 복붙하면 같은기능 사용가능 2.변수 활용 아래처럼 중복되는 코드들은 var 변수선언해주고, 변경할때 변수만 변경 공감수 0 댓글수 0 2023. 4. 23.
  • [JS-자바스크립트]3.조건문 (논리연산자, IF문, swith문) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ [1]논리 연산자 (1)부정 (!): 값의 부정 (2)and (&&): 조건이 모두 참일경우 처리 (3)or (||): 조건이 하나라도 참일경우 처리 [2]if조건 (1)기본공식 If(조건){ 조건이 참일 경우 실행 }else if(조건){ 조건이 참일 경우 실행 (선행조건이 거짓) }else{ 위 모든 조건이 거짓일 경우 } (2)실제 코딩 1)논리 연산자 (and, or, 부정 연산자 2)조건문 (밑에 주석처리한거) [3]switch (1)기본공식 Switch(값){ case 조건 : 실행문; break; case 조건 : 실행문; break; case 조건 : 실행문; break; default : 기본값; break;.. 공감수 0 댓글수 1 2023. 4. 23.
  • [JS-자바스크립트]2.기본 (변수, 데이터타입, 연산자, 기타-메소드,제어할태그선택) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ [1]변수 -사용하는 이유: 중복으로 선언해주고, 변할때 그것만 변경 (1)선언 var 변수명; (변수명은 한눈에 알아볼수있겠금 하는게 좋음) (변수명은 “저장공간” 개념) (2)값표시 Var 변수명 = 값; ________________________________________________________________________ [2]데이터 타입 1.undefined (값의 유형이 정해지지 않은상태) 값도 없고, 유형도 정해지지 않았음 > 결과에 “undefied”라고 표시됨 밑에는 값이 있긴하지만, 유형이 정해지지는 않았음 > 결과에 “10”이라고 표시됨 2.숫자형(number), 문자형(string), 논리형(b.. 공감수 0 댓글수 0 2023. 4. 23.
  • [JS-자바스크립트]1.기본개념 (script태그 / 이벤트(onclick) / 콘솔) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ @@@@@@@@1강@@@@@@@@ 1.수업소개 - 사용자와 상호작용하기 위해 나온 언어 @@@@@@@@2강@@@@@@@@ 2.수업목적 -야간모드 주간모드 기능을 만들어볼 예정 (버튼으로 배경색 변경) @@@@@@@@3강~5강@@@@@@@@ 3.HTML과 JS의 만남 (Script 태그, 이벤트, 콘솔) [1]script태그 (1)기본개념 - 이제부터 자바스크립트 시작합니다. Ex) >>>hello 표시됨 (2)html과 차이 1)html (정적임) 1+1 >>>>> 1+1로 표시됨 2)js (동적임) >>>> 2로 표시됨 [2]이벤트 (1)onclick 이벤트 (속성) - onclick으로 클릭하면 > alert창 생성 (2.. 공감수 0 댓글수 1 2023. 4. 23.
  • [CSS]5.코드 재사용 (CSS공통파일 > 중복제거) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ @@@@@@@@14강@@@@@@ css코드의 재사용 [1]css코드 재사용 지금까지 만든 코드 다른페이지들에도 모두 적용시키려면 1번)페이지마다 모두 복붙 (만약 페이지가 1만개 라면????) 2번)css파일을 별도로 만들어서 붙여넣기 > link태그 사용 공감수 0 댓글수 0 2023. 4. 23.
  • [CSS]4.미디어쿼리 (media) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ @@@@@@@@12강~13강@@@@@@ 미디어쿼리 소개 및 써먹기 [1]미디어 쿼리 기본 - 화면의 크기에 따라 반응형 최적화 되는 디자인 (1)div태그를 어쩔 때 보이고, 어쩔때 안보이도록 하고싶다면 1)개발자도구에서 화면의 크기 확인 2)screen width > 800px 이때 div태그를 display:none;으로 하고싶음 -min(최소) 과 max(최대) 개념 Ex)max-width:800px >>> 800피셀보다 작을 때 [2]미디어쿼리 사용해보기 (1)800px보다 작을 때 아티클 아래로 내리기 (@media부터 ) 공감수 0 댓글수 0 2023. 4. 23.
  • [CSS]3.그리드(grid) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ @@@@@@@@10강~11강@@@@@@ 그리드 소개 및 써먹기 [1]그리드 기본 (가장 최신 굳굳) “실습에서 본문 내용을 오른쪽으로 배치시키기 위함” (1)div 태그 -아무런 의미가 없고, 단지 디자인을 위한 태그 (기본적으로 블록레벨 element) (2)span 태그 - div와 동일한데 인라인 element임 (3)grid 속성 Ex) display:grid; Grid-template-columns: 150px 1fr; Cf)fr 화면전체에서 어느정도 사용할지. 아래 예시에서 navagation은 105px, article은 1fr 만약 2fr 1fr하면 > navagation은 3분의2, article은 3분의1을.. 공감수 0 댓글수 0 2023. 4. 23.
  • [CSS]2.박스모델 @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ @@@@@@@8강~9강@@@@@ 박스모델 [1]박스모델 1. 태그 영역 구분 (전체영역 vs 내영역) (1) block level element(태그) - 전체 블록을 사용하는 태그 (2) inline element - 자기 자신의 부피만큼 사용하는 태그 예시)h1태그는 블록라벨, a태그는 인라인 (3) display -블록레벨이지만 인라인으로 변경해 사용하는 방법 Cf)display:none; 으로 코딩하면 해당 태그 자체가 사라짐 >>>위에 Border-width:5px; border-color:red; border-style:solid;이거를 간단하게 Border:5px solid red; 이렇게 사용도 가능 2. 박스.. 공감수 0 댓글수 0 2023. 4. 23.
  • [CSS]1.CSS기본 (속성, 선택자, class, id, 중복/자손/자식/일반/인접 선택자) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ @@@@@@@@2강@@@@@ CSS가 등장하기 전의 상황 [1]HTML로 꾸미기 시작 태그 등 내용 >>>html은 정보전달인데 디자인이 들어가면서 일관성이 없음, 또한 몇만개의 태그를 모두 바꿔야한다면 너무 노가다..아니 불가한 작업이됨… >>>그래서 지금은 디자인할 때 html안쓰고 새롭게 CSS언어 만들어서 꾸밈 @@@@@@@@3~7강@@@@@ CSS등장, 기본문법, 혁명적변화,속성,선택자,class,id [2]기본문법 1. CSS 사용방법 2가지 (1) 따로 태그생성 >>>여러 태그에 디자인 줄 때 (2)html의 속성으로 활용 내용 >>>1개 html태그에만 디자인 줄 때 2. 선택자와 속성 예시) >>> a태그에 .. 공감수 0 댓글수 0 2023. 4. 23.
  • [HTML]3.활용 (동영상삽입,댓글기능,채팅기능) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ @@@@@30강~35강@@@@@ 부록 [1]동영상 삽입 -유뷰브 소스 (iframe 태그)내거에 복붙해서 영상사용 [2]댓글 기능 추가 -디스커스 사이트활용 https://disqus.com/ 1)your sites(왼쪽 상단) > new > 웹사이트이름,카테고리 지정 > 크리에이트 사이트 > 렛츠겟스타트 >인스톨 디스커스 > I don’t…클릭 > 상단 코드 복사 > 웹사이트 body하단에 붙여넣기 2)url을 서버를 통해서 열어야함 (로컬호스트 IP index.php 열어야함 > 그럼 댓글기능 생김 [3]채팅 기능 추가 -tawk 사이트 활용 https://www.tawk.to/ 1)로그인 > 왼쪽 관리자(톱니바퀴)클릭 .. 공감수 0 댓글수 1 2023. 4. 23.
  • [HTML]1.기본 (실습환경 ATOM, 깃허브, 아파치) @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ [1]ATOM - 코드 편집기 @@@@@5강@@@@@실습환경 준비 1.atom설치 2.atom인스톨 3.html폴더 (바탕화면이든 아무데나)만들기 4.atom에서 open folder로 html폴더 열기 5.파일 생성 ( “아무이름”.html) ( 확장자가 html) 6.브라우저에서 컨트롤+o > 열기 > 해당 파일 열기 7.atom에서 작업하고 > 브라우저 새로고침하면 작업한거 반영됨 @@@@@16강@@@@@ 원시웹 [1]원시웹 (1)인터넷 > 웹 (인터넷이 큰 범위) -인터넷은 1960년대 핵전쟁 이후 통신마비 대비해 보완하면서 발전 -웹은 1990년대 스위스에서 생성 (팀버너스리) (info.cern.ch 에서 웹이시작.. 공감수 0 댓글수 0 2023. 4. 23.
  • [HTML] 2.태그 및 속성으로 사이트 완성 @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ @@@@@html vs css 기본구조@@@@ @html 1.기본구조 컨텐츠 ex) 방문해주셔서 감사합니다 방문해주셔서 감사합니다 전송버튼 2. id, class 식별 콘텐츠 콘텐츠 @css 1.기본구조 선택자 {속성:속성값; 속성:속성값;} ex) h1 {color:red; font-size:12px;} 자손: div p {color:red; font-size:12px;} 자식: div > p {color:red; font-size:12px;} 일반형제: div ~ p {color:red; font-size:12px;} 인접형제: div + p {color:red; font-size:12px;} 2. id, class 식별.. 공감수 0 댓글수 0 2023. 4. 23.
  • [생코-JS] 기타. 내장객체 (날짜 / getelements / location.속성) 보호되어 있는 글입니다. 공감수 0 댓글수 0 2021. 6. 9.
  • [생코-JS]1.기본개념 (script태그 / 이벤트(onclick) / 콘솔) 보호되어 있는 글입니다. 공감수 0 댓글수 0 2021. 6. 9.
  • [생코-JS]2.기본 (변수, 데이터타입, 연산자, 기타-메소드,제어할태그선택) 보호되어 있는 글입니다. 공감수 0 댓글수 0 2021. 6. 9.
  • [생코-JS]3.조건문 (논리연산자, IF문, swith문) 보호되어 있는 글입니다. 공감수 0 댓글수 0 2021. 6. 9.
  • [생코-JS]4.중복제거 (THIS활용, 변수var활용) 보호되어 있는 글입니다. 공감수 0 댓글수 0 2021. 6. 9.
  • [생코-JS] 5.배열과 반복문(while, for문) 보호되어 있는 글입니다. 공감수 0 댓글수 0 2021. 6. 9.
  • [생코-JS] 6.함수- 매개변수(파라미터),인자(아규먼트),리턴 / 보호되어 있는 글입니다. 공감수 0 댓글수 0 2021. 6. 9.
  • [생코-JS] 7.객체 (기본문법(객체,속성,메소드)/ 반복문 / 내장객체-object, number, date, math, DOM, BOM……) 보호되어 있는 글입니다. 공감수 0 댓글수 0 2021. 6. 9.
  • [HTML]2.태그 및 속성으로 사이트 완성 @@@@@유튜브 생활코딩으로 학습한걸 메모하는 용도인 점 참조 부탁드립니다@@@ @@@@@html vs css 기본구조@@@@ @html 1.기본구조 컨텐츠 ex) 방문해주셔서 감사합니다 방문해주셔서 감사합니다 전송버튼 2. id, class 식별 콘텐츠 콘텐츠 @css 1.기본구조 선택자 {속성:속성값; 속성:속성값;} ex) h1 {color:red; font-size:12px;} 자손: 자식: 일반형제: 인접형제: 2. id, class 식별 @@@@@6강@@@@@기본문법 태그 [1]태그 1.strong태그 볼드처리해주세요 2.underline 태그 밑줄해주세요 @@@@@7강@@@@@혁명적인 변화 3.h1 태그 제목처리해주세요 @@@@@8강@@@@@통계에 기반한 학습 -150개 정도의 태그가 있지만.. 공감수 0 댓글수 0 2020. 8. 16.
  • [비공개][그로스해킹] 0.최종요약 보호되어 있는 글입니다. 공감수 0 댓글수 0 2020. 7. 1.
    문의안내
    • 티스토리
    • 로그인
    • 고객센터

    티스토리는 카카오에서 사랑을 담아 만듭니다.

    © Kakao Corp.