타입스크립트 satisfies 연산자

타입스크립트 satisfies 연산자에 대해 학습하고 정리하기

Nexus로 npm registry를 구축해서 팀 내부 의존성 및 프론트엔드 라이브러리 공유하기

오픈소스 저장소 관리 시스템인 Nexus를 통해 사내 혹은 팀 내부적인 공통 라이브러리 및 의존성, 아티팩트를 공유하는 방법에 대해 학습하고 정리하기

JSDoc 알고 사용하기

JSDoc에 대해서 학습하고 정리

Nodejs v17 이상 버전에서 OpenSSL 관련 에러 해결하기

Nodejs v17 이상 버전에서 OpenSSL 관련 에러 해결하는 방법에 대해서 정리하고 기록하기 Error: error:0308010C:digital envelope routines::unsupported

MySQL 사용자 계정 추가 및 관리

MySQL에서 데이터베이스에 접근할 수 있는 사용자 계정을 추가할 수 있는 방법과 다양한 관리 방법에 대해서 정리하고 학습한다.

Vue Higher Order Component(HOC) 정리

Vue 고차 컴포넌트(Higher Order Component)에 대해 정리하고 학습

Vue 컴포넌트 디자인 패턴

Vue 컴포넌트를 작성할 때 사용할 수 있는 여러가지 디자인 패턴에 대해서 정리하고 학습하기

SCSS Loader prepandData와 additionalData 정리

웹팩 SASS(SCSS) Loader의 prepandData와 additionalData 옵션에 대해서 정리

라즈베리파이 4에 Docker를 설치하고 Node.js 어플리케이션 실행하기

라즈베리파이에 Docker를 설치하고 백엔드 어플리케이션(Node.js)를 실행해보기

라즈베리파이 4 Model B 환경 구성하기

라즈베리파이 4 Model B SSH 환경 구성과 HDMI 없이 라즈베리파이 4 제어하기

Git Hooks를 내 프로젝트에 통합해주는 Husky

Git Hooks에 대해서 알아보고 이를 손쉽게 사용할 수 있도록 도와주는 Husky라는 오픈 소스에 대해서 정리하고 이해하기

Angular에서 Transition 사용법과 이해

Angular에서 Transition을 사용하는 방법과 동작하는 방식을 이해하기 - 공식 문서

리액트와 일렉트론으로 데스크탑 애플리케이션 만들기 (포르젝트 초기 구성)

리액트와 일렉트론으로 프로젝트를 초기 구성해보고 데스크탑 애플리케이션을 만들어보기

일렉트론 톺아보기

일렉트론 설치부터 빌드까지, 공식 문서 보며 차근차근 톺아보기

Angular Routing 이해하기

Angular Routing에 대해 간단히 알아보고 정리해보기

Angular 프로젝트 설치하고 컴포넌트 만들기

Angular 프로젝트 설치하고 컴포넌트 만들기 CLI 설치하기

Vue 컴포넌트 빌드 전략 롤업과 웹팩 비교

Vue 컴포넌트를 외부로 배포하기 위해 사용하는 번들링 툴 웹팩과 롤업을 사용해보고 비교해서 정리하기

package.json의 dependencies와 devDependencies의 차이점에 대한 정리

dependencies와 devDependencies의 추상적인 차이점과 실제로 체감이될만한 차이점을 정리하고 이해하기

리액트와 리액트 네이티브

리액트와 리액트 네이티브에 대해서 알아보고 리액트 네이티브의 특징에 대해서 정리

docker run -p 옵션과 Dockerfile의 EXPOSE와의 차이

docker run -p 옵션으로 매핑하는 포트 룰과 Dockerfile에 작성되어 해당 포트를 외부로 개방하는 옵션과의 차이

Node.js와 Docker 그리고 Jenkins.

Node.js 애플리케이션을 Docker 컨테이너 형태로 Github과 연동해서 Jenkins로 자동 빌드하기

Vue 3에서 Vuex와 타입스크립트 같이 사용하기

Vue 3 환경에서 Vue 전용 상태 관리 에코 시스템 Vuex와 타입스크립트로 프로젝트 구축하기

내 Node.js 애플리케이션을 Docker에 올리기

Docker에 Node.js 올리기

Next.js 시작해보기

Create Next App을 이용해 Next.js 프로젝트를 설치하고 구조 살펴보기

타입스크립트 인터페이스 아주 간단하게 살펴보기

타입스크립트에서 인터페이스를 사용해보자.

타입스크립트 유틸리티 타입과 타입 챌린지로 실력 올리기

타입스크립트 유틸리티 타입으로 다양한 타입을 선언해서 사용하고 타입 챌린지 오픈 소스 프로젝트를 통해 타입스크립트 실력 기르기

Hello World, Rust

모질라에서 개발한 프로그래밍 언어인 러스트에 대해서 알아보고 설치 후 Hello World 출력해보기

크롬과 사파리에서 toLocaleDateString과 toDateString 비교

toLocaleDateString과 toDateString에 대해서 알아보고 비교, 크롬과 사파리에서 일어날 수 있는 이슈에 대한 정리

Socket.io 5분만에 배우기

HTML5 API 중 하나인 웹 소켓에 대해서 알아보고 웹 소켓을 좀 더 깔끔하게 사용할 수 있는 라이브러리인 Socket.io를 사용하는 방법을 정리하기

Vue i18n 간단하게 사용하기

Vue에서 국제화를 지원하기 위한 오픈 소스 vue-i18n을 간단하게 사용해보기

신입 개발자 포트폴리오용 협업 프로젝트 회고록

신입 개발자가 포트폴리오에 넣을 프로젝트를 개발하고 팀원들과 협업하면서 있었던 일들과 어떻게 진행했는지, 아쉬웠던 점을 기록

자바스크립트 논리 연산자와 참, 거짓으로 평가되는 값들

자바스크립트 논리 연산자와 참, 거짓으로 평가되는 값들에 대해서 알아보고 학습해보기

자바스크립트 데이터 프로퍼티와 접근자 프로퍼티 이해하기

데이터 프로퍼티와 접근자 프로퍼티에 대해 이해하고 정리하기

프로그래머스 크레인 인형뽑기 게임 파이썬 풀이

프로그래머스 크레인 인형뽑기 게임을 파이썬을 풀어보자

그래프 깊이 우선 탐색 DFS, 백준 2606번 바이러스 문제

그래프를 탐색하는 알고리즘 중 하나인 DFS에 대해서 알아보고 실전 알고리즘 문제에 적용하기

Unknown at rule @tailwind 경고 회피하기

tailwind 구문을 CSS 파일에서 사용했을 때 나타나는 경고 문구 회피하기

자바스크립트 유효 범위와 var

자바스크립트 유효 범위와 var에 대한 기본 정리와 클로저에 대해 간단히 정리

타입스크립트 제네릭 사용하기

메타몽같은 녀석 제네릭에 대해서 알아보고 정리하기

백준 7785번 회사에 있는 사람 문제

백준 7785번 회사에 있는 사람 문제 파이썬 풀이

리액트와 Firebase 프로젝트 초기 환경설정

리액트에서 Firebase를 사용하기 위해서 애플리케이션을 초기화 하기

백준 7568번 덩치 문제

백준 7568번 덩치 문제 파이썬 풀이

리액트 Context API와 useContext()

리액트에서 Context API와 useContext()를 사용해서 부모에서 자식으로 데이터 넘겨주기

백준 14222번 배열과 연산 문제

백준 14222번 배열과 연산 문제 풀이

프로그래머스 스택/큐 기능 개발

프로그래머스 기능 개발 문제 파이썬 풀이

리액트 절대 경로 사용하기

리액트에서 절대 경로를 사용하여 임포트 지옥에서 빠져나오기

프로그래머스 완주하지 못한 선수

프로그래머스 완주하지 못한 선수 문제 파이썬 풀이

프로그래머스 두 개 뽑아서 더하기 알고리즘 문제

프로그래머스 알고리즘 문제 두 개 뽑아서 더하기 파이썬 풀이

백준 1978, 2581, 1929번 소수 구하기, 소수 찾기

백준 1978, 2581, 1929번 소수 구하기, 소수 찾기 문제 파이썬 풀이

백준 2947번 나무 조각 문제

백준 2947번 나무 조각 문제 파이썬 풀이

백준 10820번 문자열 분석 문제

백준 10820번 문자열 분석 문제 솔루션

자바스크립트로 모바일 기기 감지하는 여러 방법

자바스크립트로 모바일 기기를 감지하는 여러 방법에 대해서 조사해보고 정리하기

최소공배수와 최대공약수 알고리즘 (유클리드 호제법)

유클리드 호제법을 이용해서 최소공배수와 최대공약수를 쉽게 구하는 알고리즘을 구현

자바스크립트 디자인 패턴 - 중재자 패턴

자바스크립트 디자인 패턴 중 하나인 중재자 패턴에 대해서 알아보고 예시를 작성하여 정리하기

자바스크립트 디자인 패턴 - 모듈 패턴, 옵저버 패턴

디자인 패턴 중 2가지, 모듈 패턴과 옵저버 패턴에 대해서 정리하고 자바스크립트로 구현해서 각각의 특징을 알아본다.

node_modules에 설치된 외부 라이브러리 수정하기

의존성으로 설치 된 패키지를 수정하는 방법에 대해서 정리하고 알아보기

Vue 3 훑어보기

Vue 3 릴리즈된 기념으로 새로 추가된 기능 일부를 훑어보기

자바스크립트 프로토타입, 클래스에 대한 개념 이해

생성자 함수를 통해 객체를 생성하고 프로토타입을 이용해서 객체와 객체 간의 상속을 구현해본 다음 ES6 이후 문법인 클래스를 이용해 생성자 함수와 프로토타입 방식과 비교해보기

Vue Directive 알아보고 만들어보기

Vue에서 기본적으로 제공하는 13가지 디렉티브를 훑어보고 사용자 지정 디렉티브를 만들어보기

테이블 아이템에 여백을 주는 여러가지 방법

HTTP HEADER에 대한 정리

응답과 요청에 부가적인 정보를 넣을 수 있는 헤더에 관한 내용을 이해하고 정리하기

자바스크립트의 에러와 처리 방법에 대해서 알아보기

자바스크립트에서 에러란 어떤 것이고 기본 내장되어 있는 에러 객체 외에 에러 객체를 커스텀해서 특별한 에러 객체를 만들고 에러 객체의 특성에 대해서 알아본다.

CSR vs SSR (클라이언트 사이드 렌더링과 서버사이드 렌더링)

클라이언트 사이드 렌더링(CSR)과 서버 사이드 렌더링(SSR) 각각 동작 방식을 이해하고 서로의 장단점을 정리하기

Nodejs Console Color를 바꿔보자

Nodejs Console에 색상을 입히는 다양한 방법

HTMLCollection과 NodeList의 차이점과 일반 자바스크립트 배열로 바꾸기

HTMLCollection 인터페이스와 NodeList 인터페이스의 차이점과 특징, 그리고 이러한 유사 배열을 일반 자바스크립트 배열 객체로 변환하는 방법을 서로의 특징을 이해하고 정리한 뒤 사용해보기

Nodejs(Express)와 Sequelize를 같이 사용하기

데이터베이스의 데이터들을 객체로 매핑해주는 ORM을 이해하고 자바스크립트에서 ORM을 위한 라이브러리를 이용해서 실제 데이터베이스에 접속해서 간단한 서버를 만들어 보기

자바스크립트로 IntersectionObserver API 다루기

자바스크립트로 웹 API중 하나인 IntersectionObserver에 대해서 알아보고 정리하기

자바스크립트에서 모듈을 가져오고 사용해보자

Nodejs가 어떻게 모듈을 내보내고 가져오는지에 대한 정리

자바스크립트 기본 개념 이해하기 - 프로토타입, Shadow DOM

자바스크립트 기본 개념인 프로토타입, Shadow DOM 등을 이해하고 정리하기

자바스크립트 기본 개념 이해하기 - 호이스팅, 이벤트 버블링 등

자바스크립트 기본 개념인 호이스팅, 이벤트 버블링, 스코프 등을 이해하고 정리하기

원본 저장소의 내용을 최신화 시키기

가져온(Fork) 저장소를 최신 상태로 동기화하기

HTTP에 대한 이해와 정리

자바스크립트 객체의 타입 형변환

자바스크립트 객체의 타입을 변환시켜 원시 자료형 값과 더하거나 원하는 출력 형식으로 출력하는 방법

Masonry Layout 구현하기

벽돌을 쌓아 올려서 만든 느낌을 주는 Masonry Layout을 Vue와 Unsplash API로 구현하는 방법

DNS와 작동 원리

도메인 네임 시스템(Domain Name System, DNS)에 대해서 알아보고 작동 원리에 대해 정리해보자

자바스크립트 프로미스 정리

비동기 작업을 유연하게 다루기 위해 Promise를 사용하는 방법과 Promise가 나온 배경, Promise에 대한 문제점, 이를 해결하기 위한 방안 등을 정리

자바스크립트에서의 메모리 관리

자바스크립트같은 동적 프로그래밍 언어에서 메모리 관리가 어떻게 되고 있는지 알고, 메모리 관리를 누가, 어느 시점에서 하는지에 대해서 정리해본다.

CSS에서 변수 사용하기

CSS의 사용자 지정 속성을 변경하여 CSS에서 사용할 수 있는 변수를 만드는 법

자바스크립트 콘솔의 유용한 함수들

평소 자주 사용하던 console에 대해 다양한 함수들을 정리

Function.prototype.call 학습하기

Function.prototype.call 함수에 대해서 어디에 쓰일지와 기능에 대해서 알아보고 사용해보기

자바스크립트를 이용해서 텍스트를 클립보드에 복사시키는 여러 방법

자바스크립트에서 Clipboard를 사용하여 텍스트를 복사하는 여러 방법

자바스크립트 엄격한 모드 - use strict

자바스크립트로 작성된 기존의 레거시 코드들은 자바스크립트가 발전하고 이를 실행하는 엔진이 표준 규격인 ECMAScript 사양에 따라 추가되거나 변경되는 부분들에 있어서 호환이 제대로 되지 않는 부분이 분명 있을 것이다. 이를 방지하기 위해서 큰 변화가 있었던 ES6부터의 변경사항은 ES5의 기본 모드에서는 활성화되지 않도록 설계되었다. 이 변경사항을 적용시키려면 어떻게 해야되는지를 알아보고 엄격 모드에 대해서 정리한다.

Vue에서 Tailwindcss 사용하기

Vue 프로젝트에 tailwindcss 초기 환경설정 하기

5분만에 매우 간단한 영상(비디오) 스트리밍 서버 만들기

nodejs의 내장 모듈 'fs'와 외장 모듈인 'express', 'ejs' 등을 통해 간단한 영상을 스트리밍하는 매우 간단하고 기초적인 비디오 스트리밍 서버를 만든다.

Nuxt에서 Gridsome으로 블로그 전환한 이유

Nuxt에서 Gridsome으로 블로그를 전환한 이유, 그리고 "블로그"라는 목적을 가지고 개발할 때, Nuxt보다 Gridsome이 더 쉬운 이유

Vue 프로젝트에서 Font Awesome Icon 사용하기

CSS/LESS를 기반으로 하는 아이콘 툴킷 Font Awesome을 Vue Component 형식으로 래핑된 라이브러리를 쉽게 vue-cli 기반 프로젝트에 적용하는 방법

github repository(원격 저장소)에 license 추가하기

github repository(원격 저장소)에 license 추가하는 방법 소개

Linux tree 명령어로 폴더 구조를 텍스트로 변환하기

Linux tree 명령어는 ls 명령어와 비슷한 일을 하지만 tree는 폴더의 구조를 트리와 같은 형태로 나열해주거나 표시해주는 리눅스 명령어다. 폴더의 하위 폴더 구조 혹은 전체적인 폴더의 구조를 파악하는 데에 유용하다.

GraphQL 서버 환경설정

GraphQL은 쿼리 언어이다. 서버와 클라이언트 중간에 위치해서 클라이언트는 서버로부터 정말 필요한 데이터만 받을 수 있게 하고, 서버는 클라이언트가 필요로 하는 데이터만 내보낸다. (Over-Fetching 극복) 또한 기존의 REST로 구성 된 서버에서 여러 개의 데이터를 내보낼 때에는 클라이언트에서 서버로 여러번 요청하여 데이터를 받아낼 수 있겠지만은 GraphQL은 한 개의 쿼리로 여러 개의 데이터를 내가 갖고 싶은 데이터만을 서버에 요청할 수 있다.

github pages 특정 폴더만 배포 시키기

github pages 특정 폴더만 배포 시키는 방법 - subtree를 통한 방법

Vue PostCSS 플러그인으로 CSS 크기를 압축시키기

PostCSS는 일상적인 CSS 동작을 자동화하기 위해 자바스크립트 기반 플러그인을 사용하는 소프트웨어 개발 도구이다. 이 도구는 위키백과, 페이스북, 깃허브의 코드를 개발하기 위해 사용되어 왔다. PostCSS는 npm 사용자들 간에 가장 선호되는 CSS 도구이다.

Firebase로 Vue를 배포하고 커스텀 도메인 연결하기

파이어베이스(Firebase)는 2011년 파이어베이스(Firebase, Inc)사가 개발하고 2014년 구글에 인수된 모바일 및 웹 애플리케이션 개발 플랫폼이다. - 출처 위키백과

Vue에서 경로 별칭(@, ~ 등) 사용하기

Vue에서 경로 별칭(@, ~ 등) 절대 경로를 손쉽게 사용하는 방법, VSCode 자동 완성 기능 연동 방법을 소개합니다.

Vue Instance Lifecycle 8단계

뷰에서는 인스턴스의 상태에 따라 호출할 수 있는 속성이 있습니다. 이 속성들을 '라이프 사이클'이라고 하며, 우리 말로는 '생명 주기'라고 합니다.