공부하기

Semantics : 의미론, 의미시맨틱이란 의미론, 의미란 뜻의로 시맨틱 태그(Semantics Tag)는 의미있는 태그라는 말이다.우리는 흔히 html을 작성할 때 div와 span같은 의미없는 태그를 주로 사용하곤 한다.하지만 다른 사람이 봤을 때 그 의미를 유추

CSS1과 CSS2에서는 의사 클래스와 의사 요소를 나타낼 때 하나의 콜론(:)으로 함께 표기하였습니다.하지만 CSS3에서는 의사 클래스의 표현과 의사 요소의 표현을 구분하기로 합니다.따라서 CSS3에서는 의사 클래스는 하나의 콜론(:)을, 의사 요소에는 두 개의 콜론

CSS1과 CSS2에서는 의사 클래스와 의사 요소를 나타낼 때 하나의 콜론(:)으로 함께 표기하였습니다.하지만 CSS3에서는 의사 클래스의 표현과 의사 요소의 표현을 구분하기로 합니다.따라서 CSS3에서는 의사 클래스는 하나의 콜론(:)을, 의사 요소에는 두 개의 콜론

여러 블록의 위쪽 및 아래쪽 바깥 여백(마진)은 경우에 따라 제일 큰 여백의 크기를 가진 단일 여백으로 결합(상쇄)되곤 합니다. 이런 동작을 여백 상쇄라고 부릅니다. 단, 플로팅 요소와 절대 위치를 지정한 요소의 여백은 절대 상쇄되지 않습니다. -MDN-마진 상쇄, 마

CSS Normalize와 CSS Reset을 사용하는 이유는 아주 간단하다. 모든 사용자가 같은 화면을 보게 하기 위해서다. 우리는 같은 태그를 쓰고 같은 속성을 넣지만 브라우저가 해석하고 사용자에게 보여줄 때는 우리의 의도와 다르게 보여질 수 있다. CSS Norm

CSS에서 -webkit-, -moz-, -o-, -ms-라는 접두어를 본적이 있을 것이다. 각 브라우저의 엔진으로 이 접두어를 달면 해당하는 브라우저에서만 작동하도록 만들 수 있다.

코딩 컨벤션과 네이밍 컨벤션에 관해서는 몇번 들어봤지만, 자세하게 생각하지않고 규칙을 내맘대로 쓰는 경우도 많았다. 어차피 이름에 관한 내용이고, 프로그램만 잘 돌아가면 되지않냐 라는 생각도 있었다. 그러나 이번에 팀 프로젝트를 준비하면서 네이밍 컨벤션이 얼마나 중요하

의사코드는 실제 코드가 아닌 사람이 알아들을 수 있도록 일반적인 언어를 코드 형태로 써서 프로그램의 작동 원리를 표현하기 위한 언어이다.의사코드(슈도코드, pseudocode)는 프로그램을 작성할 때 각 모듈이 작동하는 논리를 표현하기 위한 언어이다. 특정 프로그래밍

JavaScript에서 호이스팅(hoisting)이란, 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미합니다. var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화합니다. 반면 let과 const로 선언한 변수의 경우

콜백 함수는 다른 함수의 인자로 전달되어 그 함수의 내부 로직에서 실행되는 함수입니다. 즉, 콜백 함수는 다른 함수의 내부에서 호출되는 함수로, 이를 이용하여 비동기적으로 처리되는 작업에서의 결과값을 받아 처리할 수 있습니다.예를 들어, 자바스크립트에서 setTimeo

데이터 불변성이란 데이터가 생성된 이후 변경되지 않는 것을 의미합니다.불변성을 유지하면 코드의 안정성, 가독성, 유지보수성, 성능 등을 개선할 수 있습니다.JavaScript에서 객체와 배열은 참조 자료형이므로 특히 불변성을 유지하는 것이 중요합니다. 객체나 배열이 변

'분해 구조 할당' (Destructuring Assignment)은 ES6(2015)에서 도입된 기능 중 하나로, 배열이나 객체를 비구조화하여 그 값을 개별 변수에 할당하는 것을 말합니다.이 기능은 변수를 선언하고 그 값을 할당하는 작업을 보다 쉽고 간결하게 해주며,

호이스팅 블로그 보러가기변수 선언 시 var와는 달리 let과 const는 선언 전에 변수 사용 시 ReferenceError를 일으킵니다.이는 let과 const가 호이스팅 되지 않기 때문이 아니라 호이스팅 되면서 var는 undefined로 초기화 되는 반면, le

자바스크립트에서 클래스는 ES6(ECMAScript 2015)부터 도입되었다.이전에는 프로토타입 기반의 객체 생성 방식을 사용했지만, 클래스 문법이 도입된 이후 객체 지향 프로그래밍을 더 직관적으로 작성할 수 있다.클래스는 자바스크립트에서 객체를 생성하기 위한 템플릿이

객체 지향 프로그래밍(Object-Oriented Programming, OOP)은 프로그래밍의 한 패러다임으로, 코드를 더 효율적이고 유지 관리하기 쉽게 만들기 위한 목표를 가지고 있습니다. 자바스크립트 예제를 통해 객체 지향 프로그래밍에 대해 알아보려 합니다.초기의

자바스크립트는 프로토타입 기반 언어 입니다. 프로토타입은 객체의 원형을 의미하며, 객체가 생성될 때 상속받은 프로퍼티와 메서드를 가지고 있습니다.인스턴스 객체가 생성자 함수의 프로토타입을 상속받아 부모의 메서드를 사용 할 수 있습니다.자바스크립트에서 모든 객체는 다른

Array.prototype.reduce() 자바스크립트 reduce는 배열의 각 요소를 순회하며 콜백 함수가 실행된 값을 누적하여 하나의 값을 반환합니다. callback : 배열의 각 요소에 대해 실행할 함수. 4개의 인자를 받을 수 있습니다. accumulat

replace는 자바스크립트에서 문자열을 다루는데 있어 매우 유용한 메서드입니다.replace는 문자열에서 특정 문자열을 찾아 다른 문자열로 대체하는 기능입니다..위와 같이 사용 할 수 있습니다. 위 코드는 문자열str에서 searchValue를 replaceValue

자바스크립트를 통해 웹어플리케이션을 간편하게 만들고, 관리 할 수 있게 해주는 라이브러리입니다다. 리액트는 컴포넌트로 구성되어있고 각 컴포넌트는 state와props를 가집니다.리액트의 JSX 문법은 JavaScript XML의 줄임말로, JavaScript 안에서 H

프로미스(Promise)는 자바스크립트에서 비동기 처리를 쉽게 관리할 수 있는 객체입니다. 비동기 처리란, 특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 실행하는 것을 의미합니다. 프로미스를 사용하면, 비동기 작업의 결과를 기다릴 필요 없이 비동기

useState와 props 이해하기

HTTP Method와 Status Code에는 무엇이 있나요?

HTTP 메서드의 멱등성

URL과 URI

소프트웨어 애플리케이션 간 상호 작용을 위한 인터페이스

REST란 Representational State Transfer의 약자로 자원을 이름으로 구분하여 해당 자원의 상태를 주고받는 모든 것을 의미합니다.

클로저는 함수와 함수가 선언된 어휘적 환경의 조합이다.

react-router-dom v6버전부터 새로 생긴 useNavigate 에 대해 써보려 합니다.

재귀란 자신을 정의할 때 자기 자신을 호출(참조)하는 것

UI(User Interface)란 사용자와 컴퓨터가 상호작용 하는 시스템 입니다.

Same-origin policy 와 Cross-Origin Resource Sharing

Redux는 자바스크립트 앱을 위한 예측 가능한 상태 컨테이너입니다.

Express는 nodejs의 웹 프레임워크로서 웹 애플리케이션, API 개발을 위해 설계되었다.

react-toastify -npm작은 토이 프로젝트에서 사용한 react-toatify를 사용하는 방법을 기록해 보려 한다.

타입 스크립트를 배우며 나오는 내용

enum은 "열거형"이라고 불리며, 특별한 종류의 클래스로서 몇 가지 사전 정의된 값들만을 허용하는 특성을 가지고 있습니다

타입 추론은 TypeScript 컴파일러가 코드를 읽어나가면서, 변수나 반환 값 등의 타입을 자동으로 결정하는 과정을 의미합니다.

TypeScript에서 타입 별칭(type alias)은 이미 존재하는 타입에 대해 새로운 이름을 부여하는 것을 말합니다.

인터페이스(interface)는 특정 구조를 갖는 값의 타입을 정의하는 데 사용됩니다.

CI/CD에 대해 알아봅니다

GitHub Actions는 Github가 공식적으로 제공하는 빌드, 테스트 및 배포 파이프라인을 자동화할 수 있는 CI/CD 플랫폼입니다.

프록시(proxy)란 말 그대로 '대리'라는 의미로, 컴퓨터 네트워크에서 중간에 통신을 대리하여 주는 서버를 의미합니다.