전체 글 119

유튜브를 시작해보려 합니다!

유튜브를 시작해보려 합니다!안녕하세요!다들 잘 지내시나요??오랜만에 게시글을 올리네요! 이런저런 바쁜 일들도 많았지만, 스스로 블로그에 더 신경을 써야 하는데 이런 부분이 너무 미흡했던 것 같네요!이제부터라도 다시 초심을 찾고 천천히 게시글을 다시 적어가도록 해보려 합니다! 다름이 아니라 이번에 유튜브를 시작해 보면 어떨까 하고 시작을 하게 되었습니다.제 얼굴이나 목소리를 보이는 것은 아니지만, 그리고 뭐 특별한 콘텐츠도 아니지만,스스로 공부하고 코딩하면서 들어볼 만한 노래들을 자주 업로드해보려 합니다! 이제 1주일 정도 되어서 특별한 것 전혀 없지만, 블로그와 유튜브를 병행해보려고 합니다! 오늘도 하루 너무너무 고생 많으셨습니다!짧은 주말이지만 평일보다 알차고 의미 있게 보내시길 바라겠습니다! 유튜브 ..

[Day] 일상 2024.04.27

NeoVim으로 개발하기, LazyVim이란?

NeoVim으로 개발하기, LazyVim이란? 안녕하세요! 오늘은 NeoVim에 관해서 짧게 알아보려고 합니다. 저는 개발을 할 때 경우에 따라 2가지의 에디터를 사용합니다. 하나는 VSCode이고 다른 하나는 NVim입니다. VSCode를 사용할 때도 Vim 플러그인을 설치하여 사용하고 있습니다. Nvim을 이용하여 개발하는 이유는 여러 가지이겠지만, 저의 경우 대략 3가지 이유라고 할 수 있습니다. 1. Vim을 이용하면 코딩하는 재미가 있습니다. 2. Vim을 이용하면 Terminal에서 바로 개발할 수 있기 때문에 동선이 짧고 여러 윈도를 동시에 작업하기 좋습니다. 3. Vim을 이용하여 개발하면 투명한 백그라운드를 만들 수 있습니다. 즉 커스터마이징이 아주 용이하다. 첫 번째와 두 번째의 이유들..

Firebase를 Next.js에 연결하는 방법.

Firebase를 Next.js에 연결하는 방법. 안녕하세요! 오늘은 간단하게 Firebase를 어떻게 Next.js 13에서 이용할 수 있는지 알아보려고 합니다. Firebase란? Firebase 사용방법? 연결 방법? 마치며. 1. Firebase란? Firebase란 Google에서 제공하는 서비스입니다. Firebase에는 여러가지 부가적인 빌드를 (기능) 제공합니다. 예를 들면 Firestore database, Authentification, Hosting과 같은 빌드가 존재합니다. 기본적으로 이러한 빌드들은 다 무료인 것으로 알고 있습니다. 하지만 더 나은 성능을 기대한다면 요금제를 선택하여 사용할 수도 있습니다. Firebase를 이용하면 손쉽게 데이터를 저장하고 유저를 생성할 수 있습니..

Prettify Type을 쉽게 확인하자!

Prettify Type을 쉽게 확인하자! 안녕하세요! 오늘은 타입스크립트에서 Type 혹은 Interface를 사용할 때 편의성을 높여주는 또 다른 타입에 관해서 알아보려 합니다. 실제로 개발을 하다 보면 한 가지 타입만을 사용하지 않고 여러 타입을 합치거나 변형해서 사용하는 경우가 대부분입니다. 타입 혹은 인터페이스를 추상화 그리고 상속화하여 사용하기 때문입니다. 이는 OOP를 공부하시다 보면 자연스럽게 배우시고 사용하게 되실 것입니다. 타입과 인터페이스 Prettify란? 사용방법? 마치며 1. 타입과 인터페이스 타입스크립트를 사용하다 보면 자연스럽게 타입과 인터페이스를 사용하게 될 것입니다. 이를 사용할 때 한 가지 타입 혹은 인터페이스에 모든 필요한 key와 그에 상응하는 타입을 지정하지는 않습..

컴포넌트의 타입을 도와주는 ComponentProps를 알아보자.

컴포넌트의 타입을 도와주는 ComponentProps를 알아보자. 안녕하세요. 오늘은 타입스크립트로 리액트라이브러리를 사용할 때 컴포넌트가 사용하는 Props의 타입을 쉽게 가져올 수 있는 ComponentProps에 관해서 알아보겠습니다. Props의 타입을 재사용하는 방법? ComponentProps란? 마치며. 1. Props의 타입을 재사용하는 방법? 리액트로 개발을 하다 보면 빈번하게 새로운 타입을 만들고 사용하며 import 하고 export 합니다. 그리고 이는 새로운 컴포넌트를 만들 때도 동일합니다. 아래의 예시를 잠깐 보겠습니다. import { FC } from 'react'; export type TestComponentPropsType = { testId: number; testNa..