목록공부 (17)
wa_ter_ve
📌 세션 & 쿠키 (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로 선언된 변수. 해당 함수 내에서만 유효함. ● 렉시..
⭐Javascript⭐1995년 넷스케이프에서 개발되어, 현재 대부분의 브라우저에서 사용되며 서버 측까지 범용적으로 사용되고 있는 프로토타입 기반의 객체지향 언어. 📌 HTML과 자바스크립트의 상호작용* html = 기본 구조, css = 스타일, Javascript = 동적 기능 제어HTML: 웹 페이지의 구조를 정의하는 마크업 언어Javascript: 웹 페이지에 동적인 기능을 추가하는 프로그래밍 언어Javascript는 HTML의 기본 구조 위에 동적인 기능을 추가하여 더욱 풍부한 사용자 경험을 제공 가능. 📌 ECMAScript(ES)란?= 자바스크립트의 표준 규격을 정의한 스크립트 언어. ✅ 역할문법, 기능 정의: ECMAScript는 자바스크립트의 기본 문법, 데이터 타입, 함수, 객체 모델 ..