wa_ter_ve

💭Q. 에스프레소의 메카니즘적 정의란?= 7~8g 정도의 원두를, 20에서 30초 가량의 시간 동안, 88도에서 95 사이의 뜨거운 물과 7~9bar 정도의 적당한 압력을 통해 추출한 25~30ml 정도의 커피 엑기스를 에스프레소라고 합니다.  Q. 라떼와 카푸치노의 차이는?= 라떼는 우유가 많아 부드럽고 고소한 맛이 느껴지고, 그에 비해 카푸치노는 거품이 많아 커피 맛이 더 진하게 느껴집니다.  Q. 리스트레토 / 롱고 / 에스프레소 차이는? 리스트레토는 물을 적게 써 진하고 농축된 맛, 롱고는 물을 많이 써 부드럽고 연한 맛, 에스프레소는 그 중간의 균형 잡힌 기본 커피 맛입니다.   Q. 크레마란 무엇인가?= 에스프레소 추출 과정에서 생성되는 황금빛 거품층입니다. 3~4ml의 양으로 커피를 보온하..

📌 세션 & 쿠키 (Session & Cookies) 🔍 세션(Session): 서버가 일정시간 동안의 사용자 요청을 하나의 상태로 보고, 해당 상태를 유지 및 추적하는 방식. (방문자가 웹 서버에 접속된 상태 → 세션) 클라이언트의 IP 주소로 각 클라이언트 식별이 불가하기에, 서버에서는 클라이언트를 식별하는 용도로 session ID를 사용.특징- 각 클라이언트에 고유 ID를 부여해, 서버가 ID를 통해 클라이언트를 구분할 수 있도록 도움.- 서버는 각 클라이언트의 정보를 저장하여, 각 요청들의 세션 정보를 유지.- 서버 메모리에 세션을 저장하므로 서버 용량에 영향을 받음. 사용자 증가시 메모리 사용량 증가.- 세션은 서버 측에서 클라이언트의 데이터를 직접 관리하기 때문에 보안성 높음.- 세션 I..

✔️ Vite + React + TS yarn create vite Project name: react-app1Select a framework >> ReactSelect a variant >> TypeScript + SWC cd react-app1 yarn yarn dev 💠Reactnpm install -g create-react-app create-react-app react1 cd react1 npm start

📌 DOM (Document Object Model) ; 문서 객체 모델웹 문서를 브라우저가 이해할 수 있게 객체로 구조화하여 표현하는 방식. 문서의 요소들은 노드가 되어 부모-자식 관계의 계층적 구조. 이 객체들을 Javascript를 통해 수정, 삭제, 추가 등 동적으로 조작 가능. 🔵 동기식 처리 모델 (Synchronous processing model) - 순차적으로 실행 (직렬) 자바스크립트는 싱글 스레드 언어로 하나의 작업만 수행 가능. 입력한 코드대로 순차적으로 동작하는 방식을 동기식 처리라고 함. 순차적으로 처리를 하게 되면 응답이 올 때까지 다른 작업을 하지 못 하고 대기해야 함. 그만큼 기다림이 길어지고 효율이 떨어지기에 성능과 사용자 경험에 영향을 미칠 수 있음. ex.) 요리를 하..

* 디스코드 공지 확인 안 하신 분들 확인하세요~코드 쓰는 방법에는 여러가지가 있지만 도무지 감이 안 잡힌다 하시는 분들은 힌트 보고 그 과정대로 차근차근 작성해보세요! 📌 과제1[html,css 파일]본인이 원하는 상품을 판매하는 창을 만들어보도록 합시다!이미지 소스에 판매할 상품의 이미지를 넣고, 내용은 자유로이 작성해 주시면 됩니다.다만, 전체적인 양식은 그대로 구현해야 합니다.(css) 더 꾸미고 싶으시면 그래도 좋습니다^^ 구현한 모든 것이 화면에 바로 보이도록 스크롤이 생기지 않게 구현합니다.각 주문자 이름, 수량, 주소, 전화번호 칸에 글자 입력이 가능해야 합니다.   수량 버튼을 누르면 목록이 떠 선택이 가능해야 합니다.(수량 목록 개수는 3개 이상이기만 하면 몇 개를 해도 상관없습니다~..

📌 1. 산술 연산자 (Arithmetic Operators)+ : 덧셈- : 뺄셈* : 곱셈/ : 나눗셈% : 나머지 연산 (나눗셈의 나머지를 반환)++ : 증가 연산자 (값을 1 증가)-- : 감소 연산자 (값을 1 감소)  📌  2. 할당 연산자 (Assignment Operators) = : 값 할당+= : 덧셈 후 할당 ( x = x+2는 x += 2와 같음 )-= : 뺄셈 후 할당*= : 곱셈 후 할당/= : 나눗셈 후 할당%= : 나머지 후 할당   📌  3. 비교 연산자 (Comparison Operators) - 두 값을 비교하여 true/false 반환== : 값이 같은가? (자동 형 변환 허용) === : 값과 타입이 모두 같은가? (엄격한 비교) != : 값이 다른가?!== :..

1. 블록문- 0개 이상의 문들을 중괄호로 묶은 것 - 제어문이나 함수 선언문 등에서 사용하며, 세미콜론(;) 붙이지X{ let block = 5; console.log(block);}  2. 조건문if / if else / else ifswitch   🔶 if / if else / else if if (조건식) {     //  조건이 참일 경우 실행} else if (조건식) {     // t 조건이 참일 경우 실행 } else {     // 위 조건들의 경우와 부합하지 않는 나머지의 경우 실행}  * 조건식에서 참이 아닌 거짓으로 취급되는 값 ( if문의 조건에 참이 아니니, else문 실행) ○ false ○ undefined ○ null ○ 0 ○ NaN ○ the empty s..

▷ 자바스크립트 코드 작성 가능 위치 ● .html 파일 속 태그 내 ● .js 파일 생성 후 연결 ● 이벤트 리스너 속성 내 Click me ● 자바스크립트 모듈 방식 📌 변수 변수는 var , let , const 키워드를 사용하여 선언하고 할당 연산자를 통해 값을 할당함. 그 후, 식별자인 변수명을 사용해 변수에 저장된 값을 참조함. Scope(스코프): 변수의 유효 범위. ● 전역 스코프 - 코드 어디서든 참조 가능. ● 지역 스코프 - 함수 자신과 하위 함수에서만 참조 가능. ● 블록 스코프(Block Scope) - let과 const로 선언된 변수. { 코드 블록 } 안에서만 유효함. ● 함수 스코프(Function Scope) - var로 선언된 변수. 해당 함수 내에서만 유효함. ● 렉시..