오늘 한일 알고리즘 Lesson 진행. Pair 와 알고리즘 코플릿 진행. 페어학습 시간에 문제를 제대로 풀지를 못해서 정규 시간 후 추가로 코플릿 복습 및 예습. 학습내용 및 성취 수도코드의 중요성 상기 및 reflection. 요구사항이 하나 이상인 문제를 여러개로 쪼개서 생각할 수 있다. 문제를 일상적인 문장으로 표현할 수 있다. (해당 위치에 바르게 주석을 적을 수 있다.) 잘게 쪼갠 특정 문제가 이미 배운 JavaScript의 어떤 개념과 연관되는지 생각해낼 수 있다. 알고리즘 짜는 프로세스 숙지 문제를 읽고 수도코드를 작성한다. 수도코드를 구체화하여 재작성한다. 코드로 옮긴다. 코드 스타일링의 중요성 숙지 코드는 뜻이 분명하고 실행 되는 한, 되도록 짧게 쓴다. 느낀점 알고리즘 문제를 푸는데,..

알고리즘을 짜기 위해서는 수도코드를 잘 작성할 줄 알아야 합니다. 이는, 현실 세계의 문제를 추상화하여 각각의 함수가 잘 작동할 수 있게 간결하게 작성하는 연습입니다. 이를 위해서, 세가지, 요구사항이 하나 이상인 문제를 여러개로 쪼개서 생각할 수 있는가. 문제를 일상적인 문장으로 표현할 수 있는가. 잘게 쪼갠 특정 문제가 Javascript의 어떤 개념과 연관되는가. 그리고, 갖추어야할 능력 5가지. 작성한 수도코드를 자바스크립트로 능숙하게 바꿀 수 있다. 타입 확인과 변환을 능숙하게 할 수 있다. 이중 반복문을 능숙하게 사용할 수 있다. 반복문 내에 여러개의 if문을 능숙하게 사용할 수 있다. for문과 while문이 필요한 때를 쉽게 파악할 수 있다. 알고리즘 문제 풀기 프로세스 텍스트에서 foo라..

특별한 대우를 받는 일급 객체(first-class citizen)인 함수는 세가지 특별 대우를 받습니다. 변수에 할당할 수 있다. assignment 다른 함수의 인자로 전달될 수 있다. argument 다른 함수의 결과로서 리턴될 수 있다. return 함수를 데이터(string, number, boolean, array, object)를 다루듯이 다룰 수 있다는 걸 의미합니다. 변수에 저장할 수 있기 때문에 배열의 요소나 객체의 속성값으로 저장하는 것도 가능합니다. 다른 함수를 인자로 받는 함수는 caller => 콜백함수를 호출(invoke)하여 실행시킵니다. 그 인자로 전달되는 함수를 callback 라고 합니다. => 호출되어 실행되는데 답신전화를 뜻합니다. => '배열' 데이터를 활용하는 메..

오늘 한일 고차함수 이해하기, 내장 고차함수 이해하기 Lesson 진행. Pair 와 고차함수 코플릿 진행. 못푼 문제 2개. 학습내용 및 성취 일급 객체인 함수의 특징을 배웠다. 변수에 할당(assignment)할 수 있다. 다른 함수의 인자(argument)로 전달될 수 있다. 다른 함수의 결과로서 리턴될 수 있다. 고차함수에 대해 배웠다. 함수를 인자(argument)로 받거나 함수를 리턴하는 함수 다른 함수(caller)의 인자(argument)로 전달되는 함수를 콜백 함수 다른 함수를 인자로 받는 경우 함수를 리턴하는 경우 함수를 인자로 받고, 함수를 리턴하는 경우 내장고차함수를 배우고 코플릿으로 실습했다. forEach, find, filter, map, reduce, sort, some, e..

BEM 방법론이란? 문제의 요소에 대한 속성에 근거하는 클래스의 이름을 짓는 구조적인 방법을 제시합니다. 예를 들어, header__form--email(차례대로 Block-Element-Modifier)과 같이 클래스명이 표현되는 것인데, 이 방법이 BEM을 활용한 것입니다. 단, BEM 방법론은 ID에는 사용할 수 없고, 오직 클래스명에만 활용할 수 있습니다. 이러한 클래스명은 BEM방식의 이름을 여러번 반복하여 재사용할 수 있도록 허락하며, HTML과 CSS/Sass 파일에서도 더 일관된 코딩 구조를 만들 수 있게 도와줍니다. Block(전체를 감싸고 있는 블럭요소) 블럭(block)은 문단 전체에 적용된 요소 또는 요소를 담고 있는 컨테이너를 말합니다. 일종의 코딩덩어리. 아래와 같이 헤더, 풋터..

Achievement Goals 만드려는 앱을 와이어프레임으로 그려볼 수 있다. 와이어프레임만 보고 HTML로 코딩할 수 있다. div (또는 section, header 등의 시맨틱 태그)로 영역을 구분하는 이유를 이해할 수 있다. HTML에서 어느 때에 id, 어느 때에 class를 사용해야 하는지 이해할 수 있다. 와이어프레임 와이어프레임(wireframe)은 골격 단순한 도형만을 사용하여 제품의 인터페이스를 시각적으로 묘사 레이아웃과 제품의 구조를 보여주는 용도 목업 실제 작동되는 모습처럼 HTML 코드를 작성. 하드코딩하는 것을 말한다. 혼동되는 용어를 정리해보자. 이곳에서 시각적인 차이를 느껴보자. https://brunch.co.kr/@cysstory/103