alswl alswl

❓ Nginx 서버 ❓웹 서버 소프트웨어로, 컴퓨터가 서버 역할을 할 수 있도록 도와주는 프로그램이다. 웹 서버 개념이 조금 헷갈릴 수 있어서 체크하고 넘어가자면, ❓ 웹 서버 ❓서버 측에서 웹사이트를 제공하는 역할을 하는 소프트웨어이다. 이를 통해 웹 브라우저와 상호작용하면서 클라이언트에게 정보를 제공할 수 있다.이는 다른 말로 HTTP 서버라고도 부르며, 브라우저와 서버 간의 HTTP 통신을 통해 웹사이트를 제공하는 역할을 한다. 💡 [헷갈릴 수 있는 개념] WAS(Web Application Server) 💡웹 애플리케이션의 비즈니스 로직을 처리하고 동적 콘텐츠를 생성하는 서버 소프트웨어이다.Java EE, .NET, Python 등의 프로그래밍 언어로 작성된 애플리케이션을 실행하여 웹 페이지를..

인터넷이 등장하기 전에는 궁금한 점이 생기면 주로 책과 같은 서적을 통해 답을 찾았다. 그러나 인터넷이 발전하면서 정보 접근 방식이 크게 바뀌었다. 오늘날 사람들은 궁금한 것이 생기면 책을 찾기보다는 구글이나 네이버와 같은 검색 엔진에 키워드를 입력해 빠르고 편리하게 답을 찾는다. 이러한 변화로 인해 웹사이트와 게시글의 소유주들 입장에서는 자신의 사이트가 더 많은 사용자에게 노출되기 위해서는 검색 엔진의 검색 결과 상위에 웹사이트가 노출되도록 최적화해야 한다는 필요성이 대두된 것이다. 바로 이러한 과정에서 등장하게 된 개념이 SEO다. 이 SEO에 대해서 자세하게 알아보도록 하자. ❓ SEO(Search Engine Optimization, 검색 엔진 최적화) ❓SEO는 웹사이트가 검색 엔진의 결과 페이..

웹 개발 환경은 빠르게 변화하고 있으며, 이에 따라 도구와 기술도 계속해서 진화하고 있다. 프론트엔드 개발을 할 때 필수적으로 사용되는 빌드 도구들이 있는데, 그게 바로 Webpack과 Vite이다. Webpack은 오랫동안 널리 사용되어 온 모듈 번들러로, 복잡한 웹 애플리케이션에서 효율적인 자원 관리와 성능 최적화를 위해 중요한 역할을 한다. 그러나 최근 Vite가 등장하게 되었는데, 이 Vite는 Webpack의 복잡성을 대체할 수 있는 간단하고 빠른 개발 환경을 제공하면서 많은 사람들에게 주목 받고 있다. 이 Webpack과 Vite에 대해서 자세히 알아보도록 할건데, 그 전에 모듈 번들러가 무엇인지부터 알고 가도록 하자. ❓ 번들링 ❓JS와 CSS 같은 파일들 하나하나를 모듈로 보고 이 모듈을 ..

JavaScript로 개발을 하다 보면, 비슷한 기능을 가진 객체를 여러 번 생성해야 하는 경우가 많다. 이때마다 매번 동일한 코드를 반복해서 작성하는 것은 번거롭고 오류 발생 가능성도 높이는 문제점들이 생긴다. JavaScript 클래스는 이러한 문제를 해결하기 위함이다. 클래스를 사용하면 객체를 생성하기 위한 틀을 만들고, 이를 바탕으로 다양한 객체를 생성할 수 있다. 이러한 JavaScript의 클래스에 대해서 자세하게 살펴보도록 하자. ❓ 클래스(Class) ❓JavaScript의 클래스는 객체를 생성하기 위한 템플릿이다. 클래스를 사용하면 객체를 쉽게 만들고 관리할 수 있다.ES6 이전에는 비슷한 종류의 객체를 많이 만들어내기 위해 생성자 함수를 사용했다. 클래스는 이 생성자 함수의 역할을 더 ..

자바스크립트는 클래스 기반의 객체지향 언어가 아닌, 프로토타입 기반의 객체지향 언어이다. 자바스크립트에서는 함수와 new 키워드를 사용하여 클래스를 흉내낼 수 있으며, 이는 객체 생성 시 기존 객체를 복사하여 새로운 객체를 만드는 프로토타입 기반의 메커니즘을 활용한다. 이 자바스크립트 프로토타입에 대해서 자세히 알아보도록 하자. ❗️프로토타입 기반 언어 특징 ❗️자바스크립트 같은 프로토타입 기반 언어는 다음과 특징을 가진다.모든 객체들이 메소드와 속성들을 상속받기 위한 명세로 프로토타입 객체를 가진다는 의미이다. 클래스처럼 객체의 인스턴스를 위한 명세와 같은 역할을 하는데, 객체 본인만이 가진 속성과 메서드에도 접근할 수 있으며, 프로토타입의 것들에도 접근할 수 있다는 것이 특징이다. 자바스크립트에서 함..

자바스크립트의 Closure는 this 키워드만큼 중요한 개념 중 하나로, 자바스크립트를 학습하는 과정에서 한 번쯤 들어봤을 내용이다. 클로저는 자바스크립트 고유의 개념이 아닌, 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어에서 사용되는 중요한 특성이다. 웹 개발 문서 저장소인 MDN에서 정의하는 클로저는 다음과 같다.클로저는 함수와 그 함수가 선언됐을 때의 렉시컬 환경과의 조합이다.  이렇게 말하면 무슨 말인지 한 번에 확 와닿지 않을 거다.이를 쉽게 말하자면, 클로저는 자신이 생성될 때의 환경을 기억하는 함수라고 할 수 있다.여기서 정의하는 '함수'란 반환된 내부 함수를 의미하고, '자신이 생성될 때의 환경'이란 내부 함수가 선언됐을 때의 스코프를 의미한다. 이것은 이해를 조금 더 돕기 위해 쉽..

자바스크립트의 this 키워드는 다른 언어와 다르게 함수나 메서드가 호출되는 방식에 따라 그 값이 결정되기에, 자바스크립트에서는 가장 기본적인 개념 중 하나이면서도 가장 혼란스럽고 중요한 개념 중 하나이다. 이 this 키워드를 주목해야하는 이유는 this의 값은 함수가 어떻게 호출되었는지에 따라 동적으로 변하고, 또한 엄격 모드와 비엄격 모드에서도 일부 차이를 가지고 있기 때문이다. this의 경우 실행 중에는 할당으로 설정할 수 없는데, ES5는 함수를 어떻게 호출하는지에 관계없이 this 값을 설정할 수 있는 bind 메서드를 도입했고, ES2015는 스스로 this 바인딩을 제공하지 않는 화살표 함수를 도입했다. 이 this 키워드의 다양한 사례와 함께 동작원리를 이해해보도록 하자. 자바스크립트의..

자바스크립트는 오늘날 웹 개발에서 가장 널리 사용되는 언어 중 하나로, 다양한 환경에서 실행되며 복잡한 웹 애플리케이션을 구현할 수 있게 도와준다. 그러나 자바스크립트는 싱글 스레드 언어로, 이로 인한 한계가 존재한다. 이러한 한계를 극복하고 웹 애플리케이션을 효율적으로 동작시키기 위해, 자바스크립트는 비동기 처리와 다양한 메커니즘을 도입하였다. 어떠한 언어를 잘 사용하기 위해선, 그 언어 문법에 대한 이해도 필요하지만 어떤 식으로 동작하는지를 알아야 그 언어의 본질을 살려 개발을 할 수 있다. 자바스크립트를 더욱 잘 사용하기 위해 자바스크립트의 자세한 동작원리부터 비동기 처리, 그리고 React와 Vue.js와 같은 프레임워크에서의 비동기 처리 방식을 알아보도록 하자. ❓ 자바스크립트(JS) ❓자바스크..