개발기록장

CSS에서 flexbox는 box나 item들을 행/열로 유연하게 배치시킬 수 있게 해주는 속성들이다. Flexbox의 속성을 보기 전에 먼저 반드시 알아야 할 중요 개념 2가지가 있다. 1. container와 item flexbox를 구현하기 위한 속성 값들은 크게 container(=감싸고 있는 큰 박스)에 적용되는 속성 값과 item(=큰 박스 안에 있는 작은 박스들)들에 적용되는 속성값이 있다. 2. main axis와 cross axis flexbox에는 main axis(=중심축)과 cross axis(=반대축)이 있다. container안에 item이 왼쪽에서 오른쪽으로 정렬되어 있는 경우에는 수평축이 중심축이 되고, 수직축이 반대축이 된다. container안에 item이 위쪽에서 아래쪽..

파이썬 기본 문법 활용으로 인스타그램 크롤링을 해보았다. beautifulsoup4과 selenium 라이브러리를 사용하여 인스타그램에서 검색한 이미지를 다운로드 하는 과정이다. 1. 준비 - chromedriver 설치 인터넷 브라우저를 제어할 수 있는 드라이버가 필요합니다. 저는 Chrome을 사용할 것이기 때문에 chromedriver를 설치했습니다. chromedriver를 설치하려면 자신의 chrome과 맞는 버전을 설치해야하는데 chrome://version/ 에서 내 chrome의 현재 버전을 확인하실 수 있습니다. 아래 링크를 통해 자신의 chrome버전과 같은 chromedriver를 선택하고 내 os에 맞게 설치합니다. chromedriver.chromium.org/downloads D..

자바스크립트의 유용한 array method에 대해 정리해보자. 1. push / pop push : 배열의 맨 뒤에 원소 추가 (원 배열 변경) pop : 배열의 맨 뒤 원소 제거 (원 배열 변경) let fruits = ['apple', 'banana']; // push fruits.push('c', 'd'); console.log(fruits);// ["apple", "banana", "c", "d"] // pop let item = fruits.pop(); // 삭제되는 원소를 반환하기 때문에 변수에 저장 가능 console.log(item);// d fruits.pop(); console.log(fruits);// ["apple", "banana"] 2. unshift / shift unshif..

템플릿 리터럴은 ES6에 추가된 문자열 표기법이다. template string이라고도 하며, 이것을 통해 문자열을 좀 더 간편하게 표현할 수 있게 되었다. 템플릿 리터럴을 사용하려면 따옴표(' ') 대신, 백틱(` `)을 사용하면 된다. - 줄바꿈 (Multi-line-strings) 표현하기 // 일반 문자열 console.log("text line 1\n"+ "text line 2"); // 템플릿 리터럴 console.log(`text line 1 text line 2`); - 표현식 삽입법 (Expression interpolation) ${ } 사이에 변수나 연산 등을 삽입하여 더 간결하게 표현할 수 있다. // 일반 문자열 const tom = 'Tom'; const helloTom = 'h..