Coding (164)

06
30

1. flex로 설정된 콘텐츠를 정 가운데 정렬하기

  • flex는 기준을 수직, 수평으로 잡는다고 생각하면 된다.
  • 이때, 부모 셀렉터 안에 flex 속성을 넣어 주고, 내가 원하는 자식 셀렉터 안에 내부 속성을 정하게 된다.
  • 위의 상황에서 내가 원하는 컨텐츠는 부모 셀렉터가 아까 자식 셀렉터인 셀렉터 안에 있게 된다.
  • 그러므로 아까의 자식 셀렉터에 justify-content로 수평 정렬, align-items로 수직정렬을 해주면 가장 가운데에 콘텐츠가 자리하게 된다.

2. flex 의 세부속성

  • flex는 세부 속성으로 아래의 3개를 가지고 있다.
  • 'flex-조절을 원하는 세부속성: 수치'로 사용한다.
  • flex는 화면의 사이즈에 따라 사이즈를 정하고, 화면이 작아지면 안의 콘텐츠도 작아진다.
    • basis : 선택된 아이템의 기본 크기를 정해준다.
      ( nth-child(원하는 번째의 아이템)을 사용하면 지정한 아이템만 사이즈를 설정할 수 있다. )
    • grow : 남은 여백을 가져간다.
      ( 어떤 박스 안에 아이템이 있을 경우, 그 박스를 가득 채우도록 여백을 가져간다는 의미이다.
      특정한 아이템을 지정하지 않으면 남은 여백을 똑같이 가져가고, 마찬가지로 nth-child로 설정하면
      원하는 아이템만 늘어나 여백을 채우게 될 것이다. 즉 비율로 움직인다. )
    • shirink : 만약, 화면보다 flex의 사이즈가 작아진다면, 콘텐츠의 사이즈도 작아질 것이다. 이때,shrink 를 이용하면, 화면이 작아져도 줄어들지 않고 컨텐츠가 사라진다. ( 수치를 0으로 정해주면 줄어들지 않는다. 수치를 늘려놓으면 그 비율만큼 줄어들 것이다. 이를 '줄어들 경우 영향을 받는다' 라고 생각한다면, 아이탬들 마다 shrink 값을 달리해서 화면이 줄어 들었을때 컨텐츠의 사이즈를 콘텐츠마다 다른 비율로 줄여 화면 안에서 내가 원하는 아이템은 줄어들지 않게 하고, 다른 아이템들은 줄여서 화면을 맞춰 줄 수 있다. )

3. 다양한 크기의 단위

  • em : 현재 폰트 사이즈를 나타내는 단위. 부모의 폰트 사이즈를 곱한 값이 된다.
  • rem (root em) : 최상위 요소인 html의 폰트 사이즈를 곱한 값이다.
  • vh, vw (vertical height & vertical width) : 브라우저, 즉 내가 보고 있는 화면의 100 분의 1 단위.
  • vmin, vmax : vh와 vw처럼 비율로 넓이와 높이의 최대치를 정해 준다.
  • auto : 오토는 오토다!
  • px : 그 작고 작은 화면 조각의 픽셀 하나를 뜻 한다.
COMMENT
 
06
29

1. 문제의 발단

언제나 문제가 많은 우분투였다. 아니나 다를까 블루투스가 아예 연결이 되지 않았다.
에어 팟을 사용하기 위해 구글링 했다.

2. Blueman 설치

  • 블루투스 연결에 도움을 주는 프로그램이다.
  • 아래의 내용을 터미널에 입력해 쉽게 설치하자
    sudo apt-get update
    sudo apt-get install blueman

3. Blueman 설정

  • 바로 연결된다면 나이스하고 사용하면 된다.
  • 연결이 안될경우, 연결하고 싶은 기기의 오른쪽 마우스를 눌러. Pair를 누른다.
  • 그래도 안된다면, Pair 아래의 Set up의 Pairing의 설정을 Proceed Without Pairing으로 바꾼다.
  • 그래도 그래도 안된다면, 기기의 이름에 띄어쓰기를 모두 없에면 된다는 말이 있다
    • 하지만 에어팟의 경우 연결이 안 되는 경우가 있었는데, 다른 기기들은 연결이 잘 되었다. 주파수 같은 게 다른 것 같다.

4. 에어팟 소리 설정

  • 여기까지 해서 연결을 어떻게든 했다면 드디어 블루투스를 이용해 즐거운 코딩 생활을 즐기자.
  • 하지만 에어팟을 이용한다면 소리를 아무리 크게 해도 개미 소리처럼 들릴 것이다.
  • 해결은 이렇게 한다.

1. sudo systemctl edit --full bluetooth.service를 터미널에 입력
2. ExecStart=/usr/lib/bluetooth/bluetoothd 라고 적힌 줄을
3. ExecStart=/usr/lib/bluetooth/bluetoothd --noplugin=avrcp 이렇게 고치자.
4. 재부팅

5. 아직도 에어팟 소리가 작아요!

  • Setting에 들어간다.
  • Sound 탭으로 간다.
  • 가장 위의 System Volume에 Over-Amplification을 켜준다.
  • 사운드를 100% 이상으로 올려서 더 크게 사용하면 된다.

노래와 함께 더 즐겁게 코딩하면 좋겠습니다!
혹시나 다른 방법이 있다면 계속 수정하겠습니다. 여러분은 어려운 우분투로 고통받지 마세요
COMMENT
 
06
29

1. countStr

  • 문자열을 입력받아, 각 문자열의 요소를 키로, 그리고 문자열에서 반복되어 나온 횟수를 값으로 가지는 객체를 리턴.
function countStr(str) {
    let result = {}; // 빈 객체를 하나 만들어서 계산될 키와 값을 넣는다.
  for(let i = 0; i < str.length; i++) { // 반복문으로 입력받은 str 을 전부 돈다.
    if(result[str[i]] === undefined) { // 만약, str 의 요소가 result의 키로 없다면,
        result[str[i]] = 1; // 그것을 키로 넣고 값은 한번 반복되었으니 일단 1로 한다.
    } else {
      result[str[i]]++ // 요소가 반복되어 나오면 값을 올린다.
    }
  }
    return result; // 마지막으로 계산된 키와 값을 리턴시킨다.
}

2. objStr:count

  • 위의 문제와 마찬가지로, str을 입력받아서, 가장 많이 입력된 문자 하나를 리턴
function objStrcount(str) {
  let result = { multStr: '', count: 0 } // 새로운 객체를 선언하여, 가장 많이 입력된 문자와 그것을 count 할 키와 값을 할당한다.
  for(let i = 0; i < str.length; i++) { // 입력 받은 문자열을 돌고 돌아
    if(result[str[i]] === undefined) { // 입력 받은 문자열이 result 에 키로 없다면,
      result[str[i]] = 0; // 키로 문자를 넣고, 값은 0으로 한다.
    }
    if(str[i] === ' ') { // 입력받은 문자에 띄어쓰기가 있을경우 무시한다.
      continue;
    }
    result[str[i]]++ // 입력 받은 문자열이 result 에 키로 있다면 값을 하나 늘려준다.
    if(result.count < result[str[i]]) { // count 와 입력받은 문자열의 값을 비교한다. 이때, count 보다 더 많이 반복 되었다면,
      result.multStr = str[i] // 가장 많이 나온 문자로 바꿔주고
      result.count = result[str[i]] // count 도 그 문자열의 반복된 횟수만큼으로 바꿔준다.
    } // 이는 반복문으로, 계속해서 입력받은 문자열 들을 돌게 되고, 그 안에서 또 더 많이 반복된 문자열이 있다면 다시 할당 될 것이다.
  }
    return result.multStr; // 마지막으로 가장 많이 나온 문자열 하나를 리턴.
}

조금 당황할 수 있지만, 그렇게 어렵지 않게 풀렸다.
다른 사람들은 모두 배열로 바꿔서 풀었다고 한다. 모두 한 배열에 넣고 배열 안의
문자를 count 하면 가능은 할 것이다.
하지만 매우매우 복잡하고 효율이 떨어질 것이다.
객체가 배열보다 조금 더 복잡하지만, 조금 더 연습하면 완벽히 다룰 수 있을 것이다.

COMMENT
 
06
28

1. 배열의 조작

  • typeof 는 object를 반환하므로, 정확히 배열인지 객체인지 알고 싶을때는 Array.isArray를 쓴다.
  • 빈 배열일 경우 => 배열의 길이가 0 일 경우 ( 그냥 0 이거나, 빈 배열 자체를 만들어 버리는 경우 deep copy가 아니므로 안된다. )
  • 당근 map, filter, reduce 모두 잘 된다.
  • 배열을 자를때는 slice(지정된 범위 만큼) 와 split(원하는 기준으로 자르기) 를 사용하면 된다.
  • spread 를 사용하면 간단하게 deep copy를 할 수 있다.
  • unshift, shift, push, pop 도 이용해서 배열을 수정한다.
  • concat 으로 배열을 합친다.

간단하게 피보나치를 풀 수 있었다.
복습 겸 이라고 생각은 했지만 고차함수를 배운 이후 배열은 문제 없는것 같다.

COMMENT