듀의 자료저장소

[결과물] vscode에서 바로 자바스크립트를 실행하기! (보통은 js파일을 import해서 불러오는 식으로 많이 씀) 1. input 태그와 type/value 속성 이용 ▶ button1 만들기! 여기에 자바스크립트 명령어를 넣어줄 예정! input 태그에는 type/ name / value 속성이 있다. type: 텍스트를 적을 수 있음 value: 실제 안에 들어가는 값 name: 변수 (버튼 2개 생성) button 껍데기 2개 완성!! 2. 자바 명령어인, onclick="alert('HELLO WORLD')" 삽입 자바의 onclick event는 클릭시, "자바스크립트를 수행"!! 3. Hello world button2 만들기 결과물 완성!!

IT 공부/자바(Java) 2021. 7. 13. 16:38

[네이버와 동일한 카테고리 부분] 만들기 html 구조로 틀을 만들고, style에 css를 입혀준다. 1. 뼈대 만들기: 초록색: span 태그 이용 하얀색: span 태그 이용, div로 묶어주기 *span에는 초록색 입혀야하고, 밑에는 또 테두리선 입혀야해서 서로 분리시킴. h1+h2 h1 뒤의 h2를 초록색으로 칠해주겠다. ▶ Naver가 초록색됨. 선택자에서 ~와 +는 그 다음걸 적용한다는 뜻! (뎁스가 동일한지 여부를 잘 살펴볼 것!) h1~span: h1 뒤에 있는 span태그에 전부 초록색을 입히겠다. .box{ } span 태그에 class 연산자 붙여서, 테두리 만들어줌. ▶ border: 3px solid black; ** hover: 마우스 오버시 인터랙션 *마우스 오버: (마우스를..

IT 공부/프론트엔드(Front-end) 2021. 7. 13. 13:59

연결 선택자 = 컴비네이션 선택자 = 조합 선택자 말 그대로 두 개의 선택자를 연결하는 것이다. [하위 선택자] 상위 요소와 하위 요소 사이에 공백을 넣어서 쓴다. ▶ 부모 요소에 포함된 모든 하위 요소에 스타일이 적용. ex) section이라는 부모 요소 안의 모든 p 요소의 색상을 파란색으로 바꾼다. section p { color: blue; } section이라는 태그로 전체를 묶고 있는 게 보인다. section 태그 안의 모든 ul 태그에 스타일 적용해보기! (1px 파란색 점선을 표시할 것) 만약 문서 안에 여러개의 섹션태그가 있을 경우, id선택자를 이용해서 #container로 그 부분만 지정 가능! 이 섹션 안에만 있는 ul태그에만 적용이 된다. [자식 선택자] 부등호로 표시할 수 있..

IT 공부/프론트엔드(Front-end) 2021. 7. 6. 18:06

요건 분석 단계는 정책을 정의하는 것과 같다. 여러 사람이 같이 하는 프로젝트이므로, 기획자나 개발자들이 n명이 될 수 있다. 그래서 산출물에 대한 가이드들을 따로 정의해야 한다., 개발자 가이드, 퍼블리셔 가이드 ,디자인 가이드들이 존재하듯이 기획자도 문서별로 가이드를 만들어줘야한다. ▶ 가이드작업도 분석단계에서 실시 [환경분석] 경쟁사나 트렌드가 있는 서비스들을 벤치마킹한다. 시장 조사도 하고 업무적인 면도 분석하고, 어떤 걸 핵심으로 개선할 것인지 기준을 잡는다. [요건분석] 현재 (ASIS)에 대한 분석이 필요하다. 요구사항 정의서라는 산출물을 이 단계에서 만들어야 한다. 이 서류를 기반으로 개발이 가능한지, 리더들이나 개발자와 상의한다. [정책정의] 회원가입을 ID가 아니라, 이메일로도 가입받겠..

IT 공부/기획공부, 트렌드 분석 2021. 7. 5. 18:14

[맞춤측정기준을 따로 설정하는 이유] 추가적인 필드를 만들어서, 데이터 수집 영역을 넓힌다. GA가 기본적으로 수집하는 데이터 외에 추가적인 데이터를 얻을 수 있다. ▶특히, 내부 고객데이터를 GA로 전송해서 맞춤 측정기준으로 고객 정보를 분석 가능하다. (맞춤측정기준으로 세그먼트를 생성하여, 특정한 사용자들을 그룹화하여 분석할 수 있다.) 관리 ▶ 속성 ▶ 맞춤정의 ▶ 맞춤 측정기준 위 순서대로 들어가서 확인할 수 있다. 유료버전(360)은 200개 까지 쓸 수 있는데 무료는 20개까지 가능하다. 이름 설정은 보고서 상에서 우리가 확인하려고 만드는 것이다. 실제 역할을 하는 건 '지수' 부분이다. (지수 넘버로 인식) 이런식으로 넘버링된 지수가 실제 활동하는 부분이다. 그리고 맞춤측정기준에는 범위(Sc..

IT 공부/마케팅(Marketing), 블로그(Blog) 2021. 6. 30. 16:26

발주사(Client)는 구축사에게 프로젝트를 맡기는 입장이다. 사전정보 요청서(RFI, Request for information) 클라이언트는 제안서를 보내기 전에 여기에 어울리는 업체들을 리스트업한다. 이 업체들에게 RFI를 보내, 어떤 곳이 해당 프로젝트에 잘 어울리는지를 본다. IT쪽에서는 투입인력을 중요하게 본다. 대형 프로젝트에서는 간혹 시장에서 어떤 기술이 여기 맞는지까지도 조사를 요청한다. 외주업체는 구미가 당길만한 어필 정보를 담아서 의뢰업체에 발송한다. 발주사는 해당 업체의 재무제표나 레퍼런스등을 체크한다. 제안 요청서 (RFP, Request for proposal) 제안서를 작성하기 쉽도록 도움을 주는 문서 (레퍼런스와 재무제표, 경력 및 업체 규모, 인력등을 본다.) 제안견적 요청..

IT 공부/기획공부, 트렌드 분석 2021. 6. 28. 14:38

[캐스캐이딩 스타일 시트(CSS)] 여러 스타일을 적용할 때 스타일이 서로 충돌하는 걸 막기 위해 정해놓은 규칙 ex) p태그도 사용하고, 클래스도 쓰고, 인라인 스타일이 다 적용됐을 때 어떤 스타일이 적용될건지 우선순위를 정하는 방법이다. -캐스캐이딩의 규칙 1. 우선순위를 따른다. 2. 부모요소에서 자식요소로 (위에서 아래로) 1. 중요스타일 1-1. 사용자 css 1-2. 제작자 css 2. 일반스타일 2-1. 제작자 css 2-2. 사용자 css 3. 브라우저 스타일 우선순위는 위와 같습니다. 사용자 스타일 같은 경우, 시스템에서 세팅해놓은 것이라 유저가 손 댈 수 없습니다. 제작자 스타일은 웹사이트를 만들때 css로 만드는 것을 뜻합니다. 브라우저는 기본값으로 지정해놓은 스타일들이 존재합니다. ..

IT 공부/프론트엔드(Front-end) 2021. 6. 25. 13:44

웹 표준이 나오기 전에는 콘텐츠(html)와 디자인(css)이 합쳐져 있었다. 지금은 이 둘이 분리되어 있어서, 한쪽을 건드리지 않고 css만 입히는 게 가능해졌다. html 마크업으로 구조를 세우고, css로 디자인을 입히면 웹 문서 형태가 된다. css zen garden이라는 사이트에 들어가면, html 구조는 같고 css만 변경한 사례들을 확인 가능하다. 이지스퍼블리싱의 CSS 기초 및 주요 선택자 인강을 들었다. p{ text-align: center; } 선택자란 어디에 적용될 지를 나타내는 것. →p 태그에 text-align(가운데 정렬)속성을 적용하겠다 p {color: blue; font-size: 18px; } → 한 선택자 안에 여러 속성을 지정 가능하다. 세미콜론으로 구분만 해준다..

IT 공부/프론트엔드(Front-end) 2021. 6. 25. 11:33