짱짱해커가 되고 싶은 나

프로젝트 계획 - 네비게이션 바 - 헤더이미지 - 아이템 메뉴 (3 * 3) - 푸터 Contact Shop Cart Login Our new Products Sunglasses 49,000 Tassel Loafer 89,000 Begie Bag 69,000 Sneakers 79,000 Slippers 29,000 Wrist Watch 99,000 Fedora Hat 39,000 Classic Loafer 99,000 Pink Bag 79,000 * { box-sizing: border-box; } body { margin: 0; min-width: 992px; font-family: "Helvetica"; } .navbar{ height: 60px; padding-left: 30px; } .logo{ ..

* static position 원래 있어야 할 포지션에 존재 (default : 포지셔닝이 안 된 요소) * relative position 원래 있어야할 위치 기준 * fixed position 브라우저 기준으로 스크롤해도 고정되어 있다 & 원래 있어야 하는 공간에 그 자리가 남아있지 않다. ex) 네비게이션 바 * absolute position 가장 가까운 포지셔닝이 된 조상(ancestor) 위치 기준

display 속성 - inline, block, inline-block, list-item, table, flex, none 등 모든 element 요소는 display 속성 중 단 하나를 갖고 있다. CSS에서 display로 변경할 수 있다. inline display ex) , , , , , - 다른 요소들과 같은 줄에 머무르려 함. - 텍스트처럼 다룰 수 있음 - 가로 길이는 필요한 만큼 차지 - width, height 지정 불가 (img는 width, height 지정 가능) block display ex) ,, , , , - 새로운 줄에 가려고 함. - 가로 길이는 최대한 많이 차지 inline-block display - 같은 줄에 머무르려 함. - 텍스트처럼 다룰 수 있음 - weigh..

웹 프론트엔드 개발은 6단계로 볼 수 있다. 1. testing 코드가 잘 작동하는지 검사 ex) Mocha 2. code formating 코드가 가독성 좋은 포맷으로 작성되었는지 검사하고 수정 ex) ESLint 3. transpiling 작성한 js 코드가 자바스크립트 최신 표준을 지원하지 않는, 오래된 브라우저에서도 문제없이 작성할 수 있도록 변환하거나 js의 단점을 보완한 언어(ex. Typescript)로 작성한 코드를 다시 js로 변환하는 트랜파일 작업 ex) Babel 4. bundling 여러 자바스크립트 파일들과 css 파일 등을 하나의 파일로 묶는 번들링 작업 ex) Webpack 5. minifying 번들링된 결과를 더 작은 용량으로 압축해주는 작업 ex) Uglify, JS 6...

node.js를 공부해보니 외부 모듈, 패키지를 설치할 때 그냥 npm install 을 하면 해당 패키지의 depencies를 참고해서 자동으로 다른 패키지들도 설치가 된다. 이런 패키지 간의 의존성은 위험성이 존재한다. 1. 악성코드 2017년 cross-env라는 패키지와 이름이 비슷한 crossenv 라는 패키지에 악성코드가 들어있던 적이 있었다. 사용자들이 패키지를 설치할 때 오타를 별로 신경 쓰지 않고 패키지를 설치해버리는 type-squatting 기법을 사용한 경우다. 2018년에는 Event-Stream이라는 패키지가 의존하던 Flatmap-Stream이라는 패키지에 비트 코인 관련 악성코드가 포함된 사건도 있다. 2020년에는 유닉스 시스템의 중요 정보를 빼가는 악성패키지도 발견됐다. ..

우여곡절 끝에 설치는 끝냈고 시작하는 법만 간단히 정리해보자. Step1. Hadoop 시작하기 start-all.sh (jps로 잘 켜졌는지 확인) Step2. Hive 시작하기 hive Step3. MySql 시작하기 mysql -uroot -p

Git : 코드 버전 관리 프로그램 git을 사용하면 여러 개발자들이 협엽할 수 있다. == 여러 개발자가 동시에 작성한 코드를 합칠 수 있다. 다른 컴퓨터에 작업물을 보낼 수 있다. (백업본) brew install git 으로 깃을 설치할 수 있다. 버전 관리 : 파일의 변화를 시간에 따라 기록했다가 특정 시간의 버전을 꺼내 올 수 있는 시스템 버전 관리의 장점 - 지난 과정 확인 가능 - 이전 버전으로 돌아갈 수 있다. git의 역사 git은 리누스 토발즈가 개발했다. 리누스 토발즈는 리눅스를 만든 이후 BitKeeper라는 툴로 리눅스 버전을 관리 했다. 그러다가 리눅스 커뮤니티의 개발자 한 명이 BitKeepr의 내부 동작 원리를 분석하려고 했다가 리눅스 커뮤니티와 BitKeeper의 관계가 틀..

웹브라우저에게 HTML 버전을 알려주는 역할 ( 버전을 따로 안쓰면 가장 최근 버전을 자동으로 사용html5 ) 한글을 지원하는 인코딩이 필요하기 때문에 설정 필요 웹 사이트의 제목 에서 까지 머리말의 글자 크기 존재 bold체 이탤릭체 bold체와 겉보기에는 비슷해보이나 해당 텍스트가 중요하다고 표시하는 것이 목적, 스크린리더가 강조해서 읽을 수 있다. 이탤릭체와 겉보기에는 비슷해보이나 해당 텍스트를 강조하는 것이 목적. css 코드를 작성하기 위한 태그 - href="" - rel="stylesheet" //페이지와 파일 간의 관계 지정 css에서 폰트 크기를 표현할 수 있는 단위가 몇 가지 있는데 px 단위를 가장 많이 사용 안의 된 부분을 편집하고 싶을 경우에는 p i 로 하면 된다. 이 세가지는..