개발자가 되기 위한 여정

개발자가 되기 위한 시작, 어려움을 느낄 때 다시 찾아봐야할 것들

반복적으로 사용하는 데이터를 편리하게 사용할 수 있음, 코드가 간결해지고 가독성이 향상됨ex) 구구단을 반복해서 출력할 때선언 : 보관함(메모리) 확보하고 이름표를 붙이는 것 \- 변수명 : 공백 no, CamelCase할당 : 보관함에 데이터를 저장하는 것선언과 할

엄격한 비교( ===, !== )에 대한 이해if, else if, else 에 대한 이해와 사용논리 연산자 (&&, ||, !)를 통해 복잡한 조건을 간결하게 작성 (조건이 여러개인 경우)📌 논리 연산자 NOT의 특이 케이스📌 6가지 falsy 값 (기억)if 문

입력받은 인자가 소수인지 판단하는 문제케이스가 나눠지는 부분들로 쪼개서 생각예외 케이스, 범위가 작은 부분부터 작성해 정리해나감리팩토링.. 더 효율적으로 구현할 수 있는 방법Math.sqrt() 을 이용한 실행 시간 단축 방법(코드반복 횟수를 줄임.. 시간복잡도) =

HTML 웹 페이지의 구조(틀)를 짜는 언어 웹 페이지를 만드는 기초 작업 >HTML : 구조 담당, 마크업 언어 >CSS : 스타일 담당, 디자인 언어 >JavaScript : 구조와 스타일이 완성된 각 요소에 생명을 부여, 유저와 상호작용할 수 있게 하는 프로그

더 나은 사용자 경험을 제공하기 위한 것인데불편한 UI/UX 경험은 유저들이 재방문하고 싶지 않게 만들 것이다결국 서비스 유저 이탈필수 역량컴포넌트 기능별로 묶어서 제작할 줄 알기화면 구성이나 배치(레이아웃 디자인)타이포그래피와 색상 적용 등부가적 역량정렬이나 배색에

와이어프레임 웹 또는 애플리케이션을 개발할 때 레이아웃의 뼈대를 그리는 단계 단순한 선이나, 도형으로 웹이나 앱의 인터페이스를 시각적으로 묘사한 것 제품의 구조를 보여주는 용도(정적인 수준) 스타일링 요소나 UX(사용자 경험, User Experience)를 판단

nano : 텍스트 에디터npm : 패키지 매니저nvm : Node.js 버전관리 매니저Node.js : JavaScript의 또 다른 실행 환경Git : 분산 버전 제어 시스템, 협업 관리툴CLI (Command-Line Interface)입력하는 글자와 출력되는 글

이미지를 자꾸 검색해보고 참고할만한 디자인을 자꾸 봐야할 것 같다색상 조합 참고하는 사이트를 이용해보자단순 디자인 요소가 너무 많아지면 오히려 사용자 경험에 부정적인 영향을 줄 수 있을 것 같다img 태그를 다른 버튼요소와 같이 정렬해서 해보려 했지만 잘 안됨 =>

여러 개의 데이터를 한 번에 처리하는 방법에 대한 고민대량의 데이터를 쉽게 다룰 수 있게 해주는 데이터 타입 => 배열과 객체배열이나 객체를 사용하면 여러 번의 선언과 할당을 해야만 했던 작업을 단 한 번의 선언으로 해결배열은 순서에 대한 정보(index) 를 가지고

입력해야 하는 데이터의 종류가 동일한 경우 객체를 사용하면 손쉽게 데이터를 관리할 수 있습니다.이렇게 공통적인 속성을 가지는 경우 객체를 사용해야 합니다.앞서 학습한 배열과의 차이점을 스스로 정리하여 상황에 맞는 데이터 타입을 사용할지 고민하고 적용할 수 있어야 합니다

스코프란? 변수의 유효범위스코프의 의미와 적용 범위, 주요 규칙전역 스코프와 지역 스코프block scope와 function scope변수 선언 키워드(let, const, var)와 스코프와의 관계전역 객체란 무엇인가변수 접근 규칙에 따른 유효 범위 (변수가 선언된

“요소를 펼쳐서 넣어주는 것”배열을 풀어서 인자로 전달하거나배열을 풀어서 각각의 요소로 넣을 때 사용파라미터를 배열의 형태로 받아서 사용할 수 있음.파라미터 개수가 가변적일 때 유용배열 합치기배열 복사레퍼런스전개구문 : https://developer.mozi

HTML 요소를 Object(JavaScript Object)처럼 조작할 수 있는 ModelDOM을 이용해서 HTML로 구성된 웹 페이지를 동적으로 만들 수 있음위 스크립트 태그를 만나면 브라우저는 HTML 해석을 잠시 멈추고 스크립트 요소를 먼저 실행함head 태그

유효성 검사 키보드 이벤트 버튼 클릭시 콘솔에 메시지가 출력되게 작성 예시 실수하기 쉬운 사례 https://developer.mozilla.org/ko/docs/conflicting/Web/API/Element/keyup_event https://develo

Remote Repository 와 Local repository 개념을 알고 도식화 할 수 있나?local에서 작업시 init => add => commit 으로 가는 플로우를 이해하는가?add 명령시 . 이 아니라 일부 파일만 add 시키는 경우를 얘기할 수 있는가

하나의 기능 구현을 위한 여러 종류의 코드 묶음컴포넌트 하나를 만들 때 목업을 하나 만들어 보기목업을 만들 때 와이어 프레임 짜보기각 요소의 역할과 기능이 표현되도록 작성HTML/CSS 네이밍 시 container와 wrapper의 차이 \- 둘다 레이아웃을 위한 d

개발 프로젝트, 깃헙, 기술 블로그 ⇒ 평소에 준비하면서 잘 관리해야겠다!!프로젝트 같은 경우 깃헙 리드미에 기능 구현에 대해 잘 명시하면 좋겠다핵심은 잘 이해하기 + 잘 말하기 그리고 이 두가지의 밸런스말하기의 핵심은 두괄식 : 한문장 결론, 요약(연습) + 추가 설

section 1에서 HTML, CSS, JS 기본 지식을 쌓고목업 계산기와 나만의 아고라 만들기 같은 유용한 실습도 해봤다.페어 활동은 다양한 페어님들을 만나면서다양한 생각과 관점을 접하고 배우게 되는 게 있어 너무 좋은 것 같다.그리고 페어 활동이 끝나면 자동으로

특별한 대우를 받는 일급객체(first-class citizen)JS에서 대표적인 일급객체중 하나는 '함수'!변수에 할당 가능=> 함수를 배열의 요소나 객체의 속성값으로 저장 가능, 함수를 데이터처럼 다룰 수 있음다른 함수의 전달인자(argument)로 전달될 수 있음

blocking : 하나의 작업이 끝날 때까지, 이어지는 작업을 막는 것 ⇒ non-blocking : 언제든 요청을 받을 수 있다. 동기적(synchronous)이다: 시작 시점과 완료 시점이 같은 상황비동기적(asynchronous) : 요청 시점과 실행 시점이

일정 시간 후에 함수를 실행매개변수(parameter): 실행할 콜백 함수, 콜백 함수 실행 전 기다려야 할 시간 (밀리초)return 값: 임의의 타이머 IDsetTimeout 타이머를 종료매개변수(parameter): 타이머 IDreturn 값: 없음일정 시간의 간

fetch를 이용해 HTTP 요청을 보내고, 응답을 받는 연습다만 callback 형태의 요청이 존재하지 않으므로, chaining과 Promise.all그리고 async/await을 이용then then 으로 이어주지 않고 배열로 자료를 한번에 데이터를 전달할 수 있

선언형(declarative)하나의 파일에 명시적으로 작성할 수 있게 jsx를 활용한 선언편 프로그래밍 지향컴포넌트 기반컴포넌트는 하나의 기능 구현을 위해 여러 종류의 코드를 묶어둔 것독립성(기능 작동에 집중), 재사용성(유지보수, 유닛테스트)범용성JavaScript

컴포넌트 사용 중 컴포넌트 내부에서 변화하는 값컴포넌트 내부에서만 사용. 예) Toggle Swtich, Counter예) 이름, 성별, 출생지외부로부터 전달받은 값인자 같이 넘겨받을 수 있음예) 나이, 현재사는 곳, 취업 여부컴포넌트의 속성(property)을 의미부

컴포넌트 단위 개발앱의 디자인을 보면 ⇒ 컴포넌트를 찾아서 조립해나가야 함 ⇒ 컴포넌트 계층 구조로 나눠야함 ⇒ (상향식 앱 만들기) 단일 책임 원칙 (하나의 컴포넌트는 한가지 일만 한다)데이터를 어디에 둘 것인가props : 컴포넌트는 컴포넌트 바깥에서 prop

리액트의 함수 컴포넌트는 props가 입력, JSX가 엘리먼트가 출력됨 ⇒ 어떤 side effect도 없고, 순수함수로 작동해야 함 (이상적인 케이스) but, 애플리케이션을 만들때 Side Effect가 발생될 수 밖에 없는 상황이 생김 ⇒ 예) A

사용자와 컴퓨터가 상호작용하는 도구그래픽적 요소 외에 물리적인 도구(마우스, 키보드)도 상호 작용을 위한 도구이므로 UI 에 해당됨=> 곧 있으면 나올 vr, ar 기기와 그에 딸린 물리적 제어 장치들도 이런 거라고 볼 수 있을 듯이중에서 프론트엔드에서 구현할 것과 밀

필터 버튼을 누르면 모달창이 뜨면서 필터링 옵션이 뜸언어와 지역, 통화 설정도 모달창으로 뜨면서 선택할 수 있음숙소의 유형을 섹션화해서 유형별 콘텐츠를 분리해서 보여주고 있음기상천외한 숙소, 국립공원, 통나무집, 섬...메뉴 항목을 최소화하여 메뉴바 안에 숨겨놨다가 누

리액트 : 상태와 속성(props)을 이용한 컴포넌트 단위 개발 구조와 방법을 학습리덕스 : 컴포넌트와 상태를 분리하는 패턴을 연습=> 리덕스는 전역 상태를 관리할 수 있는 저장소인 Store를 통해 상태 관리를 보다 효율적으로 할 수 있게 도와줌상태 변경 이벤트 발생

"CI"는 개발자를 위한 자동화 프로세스인 지속적인 통합(Continuous Integration)"CD"는 지속적인 서비스 제공(Continuous Delivery) 및/또는 지속적인 배포(Continuous Deployment)개발자를 위한 자동화 프로세스, Cod

별도의 응답 헤더를 받을 필요 없이 브라우저는 React 앱으로 데이터를 요청하고, 해당 API 요청을 (브라우저를 거치지 않고) 백엔드로 전달백엔드 서버는 응답을 React 앱으로 보내주게 되고React 앱은 서버로부터 받은 응답 데이터를 다시 브라우저로 전달함이런

전화번호가 문자열 phone_number로 주어졌을 때, 전화번호의 뒷 4자리를 제외한 나머지 숫자를 전부 \*으로 가린 문자열을 리턴하는 함수를 만드는 문제처음에는 str.replace()를 써보려했지만 바꿔줄 수를 인자에 명시할 수 없을 것 같아서 새로운 strin

array의 각 element 중 divisor로 나누어 떨어지는 값을 오름차순으로 정렬한 배열을 반환하는 함수를 작성divisor로 나누어 떨어지는 element가 하나도 없다면 배열에 -1을 담아 반환forEach는 반환값이 undefined 이기 때문에 결과에 바

어떤 정수들이 있는데, 이 정수들의 절댓값을 차례대로 담은 정수 배열 absolutes와 이 정수들의 부호를 차례대로 담은 불리언 배열 signs가 매개변수로 주어짐.실제 정수들의 합을 구하여 return 하도록 solution 함수를 완성.