본문 바로가기

Front-End, CS 스터디38

[리액트 React] 기초반 강의 1주차 정리 ✅ 프로트엔드 기초 지식 1️⃣ 서버와 클라이언트 복습 👌 웹의 동작 개념 - HTML을 받는 경우 우리가 보는 웹페이지는 모두 서버에서 미리 준비해두었던 것을 "받아서", "그려주는"것이다. 🔹 브라우저가 하는 일 1) 요청을 보낸다. // 어디에 요청을 보낼까 ? : 서버가 만들어 놓은 "API"라는 창구에 미리 정해진 약속대로 요청을 보내는 것. EX) https://naver.com/ → 이것은 "naver.com"이라는 이름의 서버에 있는, "/"창구에 요청을 보낸 것이다. 2) 받은 HTML 파일을 그려준다. 👌 웹의 동작 개념 - 데이터만 받는 경우 항상 위 처럼 HTML만 내려주는 것이 아닌, 데이터만 내려 줄 때가 더 많다. 사실 HTML도 줄글로 쓰면 이게 다 데이터인 것! 만약, 공연.. 2022. 7. 22.
[자바스크립트 javascript] 실행 컨텍스트와 콜 스택 ✅ 실행 컨텍스트와 콜 스택 1️⃣ 실행 컨텍스트(Execution context) 자바스크립트 코드가 실행되는 환경을 의미한다. 자바스크립트에는 대표적으로 두 가지 타입의 실행 컨텍스트(Execution context)가 있다. 실행할 코드에 제공할 환경 정보들을 모아놓은 객체들로 자바스크립트의 동적 언어로서의 성격을 가장 잘 파악할 수 있는 개념이다. 👌 Global Execution context 자바스크립트 엔진이 처음 코드를 실행할 때 Global Execution Context가 생성된다. 생성 과정에서 전역 객체인 Window Object(Node는 Global)를 생성하고 this가 Window 객체를 가리키도록 한다. 👌 Function Execution context 자바스크립트 엔진은.. 2022. 7. 20.
[자바스크립트 javascript] 불변 객체를 만드는 방법 ✅ 불변 객체를 만드는 방법 불변이란? 변하지 않는 것 불변 객체란? 변하지 않는 객체, 즉 이미 할당된 객체가 변하지 않는다는 뜻 자바스크립트에서 불변 객체를 만드는 방법 : const, Object.freeze() 1️⃣ const ES6 문법부터 let과 const 를 지원한다. 변수를 상수로 선언할 수 있다. 일반적으로 상수로 선언된 변수는 값을 바꾸지 못하는 것으로 알려져 있다. ES6에서의 const는 할당된 값이 상수가 되는 것이 아닌, 바인딩 된 값이 상수가 되는, 즉, test변수가 상수가 되기 때문에 const 키워드로 선언된 test 변수에는 객체 재할당은 불가능하지만 객체의 속성은 변경 가능하다. const test = {}; test.name = "mingyo"; console.l.. 2022. 7. 19.
[도서] 1일 1로그 100일 완성 IT지식 #하드웨어 ✅ 하드웨어 1번 : 컴퓨터의 논리와 구조 컴퓨터의 ‘기능적 구성’과 ‘물리적구조’로 나누어서 생각해보자. 🔹 자동차에 비유: 1959년형 중고 폭스바겐 비틀 페라리 엔진 핸들 연료 저장공간 탑승자 공간 물건 실을공간 물리적으로 다르지만 기능적으로는 100년이 넘도록 똑같이 유지되고 있다. ✅ 하드웨어 2번 : 프로세서 속도와 심장 박동수 컴퓨터를 단순화 —> 프로세서, 주 기억 장치, 보조 기억 장치, 디스플레이 등 기타 장치 프로세서, 메모리와 저장장치, 입출력장치가 있는 기본 구조를 ‘폰 노이만 아키텍처’ 책에서 설명한 용어 관련 1️⃣ CPU : 프로세서 - 주기억장치 : RAM, 임의 접근 메모리 - 보조기억장치 : 디스크, 드라이브(물리적 구현을 반영함) 프로세서 컴퓨터의 두뇌, 산술연산, 구.. 2022. 7. 19.
[자바스크립트 javascript] 공부 - 자바스크립트 문법 뽀개기 ✅ 시작하기 전 1️⃣ 프로그래밍이란? 프로그래머들이 "어떤 도구"를 이용해 컴퓨터가 작동시킬 수 있는 프로그램을 만들었고, 우리는 마우스 클릭이나 키보드 입력과 같은 익숙한 방식으로 사용하는 것. ex ) 엑셀, 노션, 쿠팡 스마트폰 앱 쇼핑 👌 프로그램이 하는 일 : 데이터의 입력 => 처리 => 출력 - 입력 : 마우스를 클릭하거나 키보드로 타이핑을 한다는 것(데이터 입력) ex) 쇼핑몰에서 우리가 상품을 고르고 배송지와 결제 카드번호 등을 입력하는 것 - 처리 : 최종 구매를 하겠다는 버튼을 누르면, 그 정보들은 어딘가에 저장이 된다. - 출력 : 최종 결제 금액은 얼마인지, 언제 어떤 물건을 구매했는지 기록이 남을거고 배송이 진행 되면서 배송 현황도 계속해서 업데이트가 된다. 그리고 이러한 모든.. 2022. 7. 18.
[자바스크립트 JavaScript] 느슨한 타입(loosely typed)의 동적(dynamic) 언어의 문제점은 무엇이고 보완할 수 있는 방법에는 무엇이 있을지 ✅ 느슨한 타입(lossely typed)의 동적(dynamci)언어의 문제점 동적타입 언어(Dynamically typed languages)는 컴파일 시 자료형을 정하는 것이 아니라 런타임시 결정이 된다. 다음과 같이 타입 없이 변수만 선언하여 값을 지정할 수 있다. def num = 123 //groovy에서는 타입이 정해지지 않은 변수를 선언할때 def를 사용합니다. num = "일이삼" 위의 예시에서 타입 선언이 없었지만, num이 123이란 숫자로 선언이 된다. 두 번째 줄에 num을 String으로 다시 선언하더라도 타입 에러 없이 컴파일이 된다. - 동적 타입 언어 : Groovy, Python, JavaScript, Ruby, Smalltalk, Lisp, Objective-C, PHP,.. 2022. 7. 18.