전체 글

전체 글

    Ubuntu 복사 붙혀넣기

    오늘 우분투 리눅스 환경에서 터미널을 통하여 폴더를 생성 및 삭제 하고, 파일을 다운로드 하고, GIT 을 하는 등 여러가지 명령어를 사용하며 수업을 진행했다. 나는 우분투를 버츄얼 박스에 다운로드 하여 진행했다. 윈도우에서는 복사가 ctrl + c 이지만 ubuntu 에서의 복사는 ctrl + shift + c 인 것을 알게 되었다. 우분투 화면이 버츄얼 박스 안에서 아주 작은 화면으로 출력 되었기에 모르는 부분을 구글링 할 때에는 윈도우에서 검색을 진행했다. 그러던 중 코드를 복사 붙혀넣기를 해야할 때 습관적으로 윈도우에서 ctrl + c를 누르는 버릇이 우분투 환경에서도 나와 작성하던 파일에서 exit 가 되었다. 그렇다. ubuntu 에서 Ctrl + c 는 프로세스 종료 이다. 그리고 또 하나 ..

    계산기 함수 만들기

    계산기 함수 만들기

    오늘은 이런식으로 계산기를 실제 처럼 작동하도록 구현해 보았다. const calculator = document.querySelector('.calculator'); // calculator 엘리먼트와, 그 자식 엘리먼트의 정보를 모두 담고 있습니다. const buttons = calculator.querySelector('.calculator__buttons'); // calculator__keys 엘리먼트와, 그 자식 엘리먼트의 정보를 모두 담고 있습니다. const firstOperend = document.querySelector('.calculator__operend--left'); // calculator__operend--left 엘리먼트와, 그 자식 엘리먼트의 정보를 모두 담고 있습니다..

    프론트앤드 스터디 그룹 5회차 회고

    프론트앤드 스터디 그룹 5회차 회고

    오늘은 정규 수업시간에 진행했던 계산기 앱 만들기 복습하고 리뷰하는 시간을 가졌다. 낮에 수업에선 페어와 다른분들께 열심히 배워서 통과 했다면, 스터디 시간엔 스스로 계산기를 구현해보고, 구체적인 의사코드 작성으로 "어떤 의사코드를 JS로 작성을 하려했는데 오류가 발생했다." 라는 식으로 오류가 발생한 것을 질문을 하며 학습하는 시간을 가졌다. 일방적으로 물어보며 작성한 코드들을 혼자 생각하고 고민하며 풀어보는 시간을 가짐으로써 정말 내가 이해를 했는지 확인해 볼 수 있어서 좋았다. 또, 다른분들이 작성한 코드들을 보며 다양한 코드 작성법과, 코드 최적화 부분을 많이 볼 수 있어, 후에는 코드 최적화에도 신경을 써봐야 겠다고 생각되어 도움이 되었다. 자세히 적어보자면 이렇다!! //내가 작성한 코드 if..

    css의 display flex 개념 익히기

    css의 display flex 개념 익히기

    부모 요소에 적용하는 속성 display : flex; .container { display: flex;/* 아이템 크기만큼 가로(기본값)로 배치*/ display: block; /* 가로 넓이만큼 세로로 배치*/ display: inline-flex; /*컨테이너가 주변 요소들과 어떻게 어우러질지 결정하는 값 */ } 자식 요소에 적용하는 속성 flex-direction : row (기본값), column , row-reverse , column-reverse row : 가로 방향으로 배치 column : 세로 방향으로 배치 row-reverse : 역순으로 가로 배치 column-reverse : 역순으로 세로 배치 flex-wrap : nowrap(기본값) , wrap nowrap(기본값) : 줄바..

    프론트앤드 스터디 그룹 4회차 회고

    프론트앤드 스터디 그룹 4회차 회고

    오늘은 스터디 참여 4회차 만에 제대로 스터디를 참여한 느낌이다. 첫째날은 어수선하기도 했고 풀기로 한 두 문제 중에 한 문제도 못풀었기 때문이다.. 둘째 날도 마찬가지로 과부화가 걸린건지 모든 생각들을 다 튕겨냈고, 한글을 읽어도 머릿속에 들어오지 않아 두 문제 중 한문제도 풀지 못했고, 풀지 못한 문제는 의사코드까지라도 작성해 풀이를 하자고 했지만 그마저도 헤매였다. 하지만 오늘은 달랐다 !! 주말에 남자친구와 같이 스터디 하고 (사실 내가 일방적으로 배웠다), 반복문을 풀어보며 개념을 익혔다. 그리고 오늘 스터디에서 문제를 풀었는데 한문제를 풀고 나머지 한문제 또한 의사코드까지 완벽하게 작성할 수 있었다. 풀면서도 스스로 정말 뿌듯했고 역시 하면 되는구나 !! 라는걸 또 느끼게 되는 정말 뿌듯한 순..

    array.reduce() 란?

    reduce() 하나의 결과값을 반환합니다. const array1 = [1, 2, 3, 4]; // 0 + 1 + 2 + 3 + 4 const initialValue = 0; // initial(초기)값 const sumWithInitial = array1.reduce( //array1(배열)을 reduce 함수를 쓰면 (previousValue, currentValue) => previousValue + currentValue, //previous(이전)값 + curren(현재)값 initialValue ); // 즉, return arr.reduce(previous, current) 하면 arr들의 합이 나오게 된다는 말. console.log(sumWithInitial); // expected o..