Javascript
1.[Javascript] Ajax
Ajax(Asynchronous JavaScript and XML)는 자바스크립트를 이용해 서버와 브라우저 간에 비동기적으로 데이터를 교환할 수 있는 통신 기능임. 이 기술의 등장으로 웹 페이지 전체를 새로 렌더링하지 않고 필요한 데이터만 서버로부터 받아서 특정 부분만
2.[TIL] js - FileReader()를 활용하여 파일 업로드 로직 구현
JavaScript - FileReader()Input 변수에 document.querySelector 통해서 "input" 저장Input에 addEventListener"change"에 대해서 살펴보면... \- 특정 HTML 요소들에 대해서 발생한 이벤트를 지
3.[TIL] 비동기 작업과 Promise
비동기 작업(Asynchronous operation)이란 프로그램의 주 실행 흐름을 차단하지 않고 백그라운드에서 수행되는 작업을 말합니다. 이런 작업 방식은 프로그램이 특정 작업의 완료를 기다리지 않고 다음 코드를 계속 실행할 수 있도록 해줍니다.Promise는 JS
4.[CSS] 백그라운드 이미지 관련 몇 가지 지식
background-image: url()image로 백그라운드 채우기배경 여러개 겹치는것도 가능함background-size: 100%; ⇒ 이미지 사이즈의 백프로로 채우기background-size: cover; ⇒ div박스에 다 채우기contain: 절대 배경
5.비동기 처리와 콜백 함수에 대해
비동기 처리란 코드의 실행이 즉시 완료되지 않고, 일정 시간이 걸리는 작업(예: 파일 읽기, 네트워크 요청 등)을 처리하는 방법입니다. 비동기 처리는 이러한 작업이 완료될 때까지 프로그램이 멈추지 않고 다른 작업을 계속 수행할 수 있도록 합니다.예를 들어, 파일을 읽거
6.JS ES6 문법 익숙해지기 (1) - 변수, 템플릿리터럴, 화살표함수
var선언 후 재정의(값을 바꿀 수) 가능선언 후 재선언 가능함수 안에서만 지역변수가 됨let선언 후 재정의 가능선언 후 재선언 불가능모든 local scope(if, for, while, try, catch 등)에서 지역변수가 됨const선언 후 재정의 불가능선언 후
7.JS ES6 문법 익숙해지기 (2) - export & import, class
export를 통해 함수, 객체, 원시 값들을 내보낼 수 있으며, 다른 프로그램에서 import를 통해 사용할 수 있음.'use strict'의 존재 유무와 관계 없이, 무조건 strict 모드임.HTML 내 스크립트에서는 사용 불가그럼, HTML의 <head>에
8.JS ES6 문법 익숙해지기 (3) - Promise, async/await와 비동기 처리
웹 애플리케이션에서는 네트워크 요청, 파일 읽기/쓰기, 타이머 등 시간이 걸리는 작업들이 많음. 이러한 작업들을 동기적으로 처리하면 브라우져가 뻗어버릴 수 있음.동기적(synchronous)이라는 말은, 한 작입이 완전히 끝난 이후에야 다음 작엄을 실행한다는 뜻임.그래
9.JS ES6 문법 익숙해지기 (4) - forEach, map, reduce, sort, filter
이번에는 javascript의 배열(array)를 조작할 수 있는 여러 방법에 대해 알아보겠음.배열의 각 요소에 대해, 함수를 한 번씩 실행함.콜백 함수는 총 세 개의 파라미터를 가질 수 있는데...currentValue: 해당 배열에서 현재 단계의 실제 값.index
10.JS ES6 문법 익숙해지기 (5) - spread, rest, destructuring
spread와 rest는 모두 (...)을 사용하여 배열/객체 요소를 활용할 수 있는 문법임.spread를 통해 배열/객체의 요소를 '펼치는' 혹은 '확장하는' 작업을 수행할 수 있음. 그게 무슨 말이냐면...반면, rest는 여러 요소를 하나로 '모으는' 역할을 수행
11.[Javascript] ajax, jQuery, Fetch API, axios
ajax는 무엇인가요 ajax는 Asynchronous Javascript And Xml의 줄임말임 서버에 GET 요청을 날려서, 웹페이지에서 수정할 일부 내용에 대한 데이터만 받아서 업데이트 따라서 새로운 데이터가 들어올 때마다 페이지 전체를 새로고침할 필요가
12.[Javascript] ReadableStream 기본
ReadableStream이 뭐임 ReadableStream은 자바스크립트에서 데이터를 한번에 처리하지 않고 stream 방식으로 처리하는 인터페이스임 용어를 정리해보면 스트림(Stream): 데이터의 흐름. 파일, 네트워크 응답 같은 것들이 연속적으로 흘러 들어온
13.[Javascript] Generator 제너레이터 이해하기
ES6 들어와서 새로 생김함수가 실행될 때의 흐름을 제어할 수 있는 방법론이며, 비동기 처리나 큰 데이터를 처리할 때 유용하게 쓸 수 있음.라고 말하면 이해가 안 되니 조금 더 쉽게 말하자면, 함수 내부의 로직들을, 함수 바깥에서 어디까지 실행하고 어디에서 멈출지를 정