code states

변수의 타입을 확인할 수 있는 메소드변수의 타입에는 숫자, 문자열, 불리언, 자료형(배열, 객체 등) 등이 있음아직 값이 할당되지 않은 변수(undefined)나 함수도 타입 중 하나형식: typeof 값;값에는 변수가 들어가도 됨

현재의 기분, 느낌 오늘 학습은 전날에 비해 훨씬 난이도가 높아진 느낌이 들어 해결하기는 어려운 부분도 있었지만 페어 프로그래밍을 통해 그만큼 페어와 많은 대화를 나누고 해결하다보니 뿌듯함은 두 배가 되었다. 내일도 열심히 할 수 있는 동기부여가 된다. 떠오르는 단어

현재의 기분, 느낌 배우고 싶었던 분야를 시작하게 된 점이 뿌듯하게 느껴지면서도 가보지 않은 분야이기 때문에 긴장되기도 한다. OT를 제외하고 수업이 이루어진 첫날이었는데 무사히 잘 끝냈다는 것에 안도감이 느껴지고 부족한 부분은 채워서 잘 활용할 수 있도록 만들어야겠다

저번주 조금 어려웠던 자바스크립트를 지나 html, css를 거치며 계산기의 mock-up을 만드는 과제를 수행했다. html과 css는 직관적으로 눈으로 볼 수 있다는 점이 재미있다보니 다양하게 시도해보며 나만의 계산기 목업을 만드는 과정이 너무 즐거웠다. 이를 바탕

사실 처음 다루어 본 내용에 처음에는 당황스럽기도 했지만 공부하면 할수록 또 다른 재미를 느낄 수 있었던 unit8. 특히 나에겐 너무 생소한 내용이라 페어와의 협업이 내용을 이해하는 과정에서 많이 배울 수 있었다.pwd: 현재 위치 확인mkdir: 새로운 폴더 생성하

배열 1. 배열 기초 > - 배열: 순서가 있는 값 값: 요소(element), 순서: 인덱스(index), 0부터 번호매김 값은 인덱스를 이용해 접근(조회, 변경) 인덱스를 벗어나면 undefined! 이중 배열의 경우 2차원 배열이라고 생

number, string, boolean, null, undefined cf) bigint, symbolbigint란?Number 값이 나타낼 수 있는 2^53-1보다 큰 정수를 표현할 수 있는 내장 객체symbol이란?값으로 익명의 객체 속성을 만들 수 있는 특성을

원시 자료형과 참조 자료형 1. 원시자료형(primitive type data) > - number, string, boolean, null, undefined cf) bigint, symbol bigint란? Number 값이

호이스팅(hoisting) > 호이스팅이란? 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미함 var로 선언한 변수는 호이스팅 시 undefined로 변수를 초기화 let과 const로 선언한 변수는 호이스팅 시 변수를 초기화하지 않음 선

DOM기초 DOM(Document Object Model): HTML 요소를 Object 처럼 조작할 수 있는 Model, HTML의 작은 부분까지 접근할 수 있는 구조 console.dir: DOM을 객체의 모습으로 출력 children: 자식 요소를

내가 만든 아고라 스테이츠 Section1의 마지막 과제로 주어진 나만의 아고라 스테이츠 만들기.디스커션을 나열하고 입력한 것들을 아고라 스테이츠에 올리는 기본적인 작업까지는 이해하고 완료했지만 페이지네이션이나 올라간 디스커션을 유지하는 좀 더 발전된 기능까지는 구현하

일반적으로 CSS를 불러오기 위해 link 요소를 head 요소의 자식 요소로 하고, JavaScript를 불러오기 위해 script 요소를 body 요소가 끝나기 직전에 위치시키는 이유가 무엇인가요?사용자가 연결된 주소의 서버에 데이터 요청(Request)웹브라우저가

고차 함수 일급 객체의 세 가지 특징 > 1. 변수에 할당할 수 있음 > 2. 다른 함수의 전달인자로 전달될 수 있음 > 3. 다른 함수의 결과로 리턴될 수 있음 콜백 함수(callback function): 고차 함수(caller)의 전달인자로 전달되는

객체 지향 프로그래밍이란? 하나의 모델이 되는 청사진(설계도)을 만들고(class), 이를 바탕으로 한 객체(object)를 만드는(instance) 프로그래밍 패턴클래스를 만드는 방법class의 경우 일반적인 함수 정의하는 것과 비슷하게 만듦다른 함수와의 구분을 위해

코드를 추상화 -> 직관적 이해 가능속성과 메서드(데이터와 기능)를 묶어서 처리 -> 하나의 객체라는 개념에 포함, 클래스(Class)라고 부름 \- JavaScript는 객체 지향 언어이다(x) \- JavaScript는 객체 지향 패턴으로 작성할 수 있다

모델의 청사진(클래스)을 만들 때 쓰는 원형 객체JavaScript는 프로토타입 기반 언어특정 객체의 프로토타입 객체상속 시키려는 멤버(상속 받는 멤버)들이 정의된 객체프로토타입 체인을 통해 상속하고자 하는 속성과 메소드를 담아두는 버킷으로 사용 \-> 객체 내부에 인

JavaScript에서 ‘상속’을 구현할 때 사용상속: 부모 클래스의 속성과 메서드를 자식 클래스가 물려받는 과정extends와 super 키워드를 이용해서 상속 구현 가능div요소의 프로토타입 체인 확인하기div -> HTMLDivElement -> HTMLEleme

객체지향 클로저 모듈 패턴 메서드 호출: 객체 내 메서드를 호출하는 방법 클래스 모듈 패턴 -> 클로저를 이용하여 일부 요소를 다른 요소와 독립적으로 유지하는 패턴을 구현한 것 counter.increment, counter.decrement, counter.val

비동기함수 왜 필요할까?🤔 동기와 비동기 > - 동기: 요청에 대한 결과가 동시에 일어남 비동기: 요청에 대한 결과가 동시에 일어나지 않음 => 효율적 요청(call)에 blocking이 없음 응답이 비동기적으로 이루어짐(요청과는 별개로 이루어짐)

프론트엔드 개발을 위한 JavaScript 오픈소스 라이브러리선언형코드를 자세히 분석하지 않고도 코드의 의도를 분명히 알 수 있게 작성하는 방식하나의 파일에 명시적으로 작성할 수 있도록 JSX를 활용한 선언형 프로그래밍을 지향컴포넌트 기반독립성: 컴포넌트 간 의존성이

React SPA 🔆 SPA 등장 배경 > #### 전통적인 웹사이트의 한계😥 페이지 이동 시 매번 페이지 전체를 불러왔던 전통적인 웹사이트 -> 시간이 지나며 사용자와 서비스 사이의 상호작용 증가 -> 중복되는 요소를 매번 불어와 서버와의 불필요한 트래픽 증가 -

🔅 Props > props란❓ 외부, 즉 부모(상위) 컴포넌트로부터 전달 받은 값을 말하는데 이는 함부로 변경될 수 없는 읽기 전용(read-only) 객체이다. 만약 props가 읽기 전용 객체가 아니라면 props를 전달받은 하위 컴포넌트 내에서 props를 직

서버(server)란 의미 그대로 해석하면 제공하는 주체를 뜻하는데 만약 서버가 존재하지 않고 하나의 앱 안에 모든 정보가 담겨있다면 어떤 상황이 발생할까?\-> 하나의 정보를 수정하거나 추가하기 위해 앱 자체를 업데이트해야하는 상황이 발생할 수 있다!❓클라이언트-서

REST API > #### Rest API의 필요성🤓 웹 애플리케이션은 HTTP 메서드를 이용하여 서버와 통신을 하게되는데 이러한 메서드의 사용은 아무런 규칙 없이 이루어지는 것이 아니며 일종의 규약이 존재한다. 이것이 REST API를 통한 바람직한 요청과 응답

React 데이터 흐름 컴포넌트 내부의 데이터 흐름 🔆 React 데이터 흐름 > #### React 개발 방식😎 React는 페이지 단위가 아닌 컴포넌트 단위로 시작하여 페이지로 조립해나가는 상향식 방식을 채택한다. 이를 사용하면 테스트가 쉽고 확장성이 좋다는 장

SOP(Same-Origin Policy, 동일 출처 정책)이란 같은 출처의 리소스만 공유가 가능한 보안 방식으로 특정 출처에서 불러온 문서나 스크립트가 다른 출처에서 가져온 리소스와 상호작용하는 것을 제한하는 방식이다. 다른 사이트(출처)와의 리소스 공유를 제한하여

🔆 재귀의 이해 > #### 재귀함수🪐 재귀의 사전적인 의미를 보면 원래의 곳으로 다시 되돌아오는 것을 말하는데 한 단계 더 나아가 컴퓨터 과학 용어에서의 재귀란 어떠한 것을 정의할 때까지 자기 자신을 참조하는 것을 뜻한다. 이와 같은 흐름으로 재귀함수를 설명한다면

UI/UX 🔆 UI/UX 개념 > #### UI📱 UI(User Interface, 사용자 인터페이스)란 사용자들이 컴퓨터와 상호작용하는 시스템을 말한다. 화면 상의 그래픽 요소들은 물론 사용자들이 키보드나 마우스와 같은 물리적 요소를 통해서도 컴퓨터와 소통할 수

[React]Custom Component 🔆 Component Driven Development > #### CDD🧐 CDD란 컴포넌트를 중심으로 개발 프로세스를 고정하는 개발 방법론이라고 하는데 이게 무슨 뜻일까? 쉽게 말하자면 컴포넌트 단위에서 시작해 컴포넌

[React]상태 관리 상태 관리 🔆 전역 상태 관리 > #### 상태🧐 상태(state)란 UI에 동적으로 표현될 데이터를 의미한다. 즉, 보여지는 화면에서 변화될 수 있는 데이터를 의미하는데 이 때 state는 props를 통해 전달되지 않으며 시간이 지나 변화

웹 표준 & 웹 접근성 🔆 웹 표준 웹 표준의 개념 > Web이란❓ Web이란 인터넷에 연결된 컴퓨터를 통해 사용자들이 정보를 공유할 수 있는 하나의 '공간'을 말한다. 즉, 문서나 이미지, 영상 등의 다양한 정보를 여러 사람들과 공유할 수 있는 공간이다. World

[네트워크] 심화 🔆 TCP/IP 네트워크의 시작 네트워크 구축 방식 : 회선교환 방식과 패킷교환 방식 > 회선교환 방식❓ 회선교환 방식이란 발신자와 수신자 사이에 있는 오퍼레이터가 통신 시작 전 미리 전용 회선을 설정해야하는 네트워크 방식을 말한다. 통신 중에서는

[Backend]인증/보안 🔆 Cookie/Session > #### Cookie🍪 Cookie란 서버가 클라이언트에게 전달하는 작은 데이터로 쿠키를 이용해 서버가 클라이언트에 영속성 있는 데이터를 저장하고 원한다면 클라이언트의 쿠키를 이용하여 데이터를 가져올 수

[자료구조/알고리즘]기초 🔆 자료구조 > #### 자료구조🗂 자료구조란 여러 데이터의 묶음을 체계적으로 정리하여 저장하고 활용하는 방법을 정의한 것을 의미하는데 한마디로 말하자면 데이터를 효율적으로 다루는 방법을 정의한 것이다. 데이터: 문자, 숫자, 소리, 그림,

[HTML/CSS]심화 🔆 브라우저 > #### 브라우저❓ 브라우저(웹 브라우저)란 웹 서버에서 쌍방향으로 통신하며 HTML 문서 및 그림, 멀티미디어 등의 컨텐츠를 열람할 수 있게 해주는 GUI 기반의 소프트웨어 프로그램이다. 쉽게 말하자면 웹 서버에 접속하여 다양

[React]번들링과 웹팩 🔆 번들링 > #### 번들링🗃 : 여러 제품이나 코드, 프로그램을 묶어 패키지로 제공하는 행위 번들: 사용자에게 웹 애플리케이션을 제공하기 위한 파일 묶음 번들링의 필요성 변수 간 충돌 방지 번들 파일 용량 압축 사용자 임의 조작 방지

[React]심화 🔆 Virtual DOM Virtual DOM > Virtual DOM이 나오게 된 배경🤔 실제 DOM은 스크립팅 언어가 접근 및 탐색하는 속도가 빨라 탐색 후 변경 및 업데이트하는 속도는 역시 빠르다. 하지만 JavaScript로 조작하는 DOM

[컴퓨터 공학] 기초

GraphQL📈: 페이스북에서 개발해 오픈 소스로 제공된 쿼리 언어Server API를 통해 정보를 주고받기 위해 사용하는 Query Language→ API를 위한 쿼리 언어트리 구조로 쿼리 결과를 받기 위해 그래프를 탐색하는 언어GraphQL의 전제모든 데이터가

[Testing]TDD 🔆 TDD 방법론 TDD(Test-driven Development)🖍 : 코드 작성 전 테스트를 사용하는 소프트웨어 개발 방법론으로 개발자가 원하는 코드 결과를 미리 정의한 후 이를 바탕으로 코드를 작성하는 방법 🔆 React와 TDD R

[최적화]Optimization 🔆 Optimization > 최적화란❓ : 주어진 조건으로 최대 효율을 낼 수 있도록 하는 것 컴퓨터 공학에서의 최적화 : 가능한 적은 리소스를 소모하면서 가능한 한 빠르게 원하는 결과를 얻을 수 있도록 하는 것 웹 개발에서의 최

CORS(Cross-Origin Resource Sharing, 교차 출처 리소스 공유): 추가 HTTP 헤더를 사용하여 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제출처: URL의 스키마

프로젝트 전 마지막 섹션 회고 본격적인 프로젝트에 들어가기 전 마지막으로 지금까지 부트캠프에서의 시간들을 솔직하게 회고해보고 다시 새로운 마음으로 프로젝트에 들어가려한다! 👩🏻‍💻 나의 최종 목표 나만의 속도를 가진, 마음에 여유가 있는 개발자 되기🛫 스스로