it + it dev nestjs naming file naming in nest.jsThis question is about code styling in Nestjs. This framework suggests file naming lowercase letters and across the dot. Example: file user.service.ts export class UserService { } another file imp... wono | discuss | tweet + it dev typescript export Avoid Export Default | TypeScript Deep Dive wono | discuss | tweet + it dev nestjs naming NestJS - 네이밍 규칙NestJS는 일반적으로 아래와 같은 규칙을 따른다. 1. 파일명은 .으로 연결하고, 둘 이상의 단어로 구성되어 있을 시 -로 연결 hello.controller.ts my-first.controller.ts 2. 클래스명은 카멜 케이스 사용 HelloController MyFirstController 3. 같은 디렉터리에 있는 클래스의 경우 index.ts 사용 // index.ts 미사용 import { HelloController } from './contrllers/hello.controller' import { MyFirstController } from './contrllers/my-first.controller' // index.ts 사용 import { HelloController, MyF.. wono | discuss | tweet + it dev react-query 6. React Query가 필요한 이유나는 React Query를 좋아한다. React Query가 React앱에서 비동기 상태를 다루는 방식을 단순화하기 때문이다. 하지만 가끔 서버에서 데이터를 페칭해오는 것처럼 "간단한" 작업에는 React Query가 필요하지 않다고 주장하는 글들을 볼 수 있다.React Query가 제공하는 모든 추가 기능이 필요한 것은 아니니까, useEffect 안에서 fetch를 사용하는 것만으로도 충분할 때 굳이 서드파티 라이브러리를 추가하고 싶지 않다는 것이다. 이는 어느 정도 맞는 말이다.React Query는 캐싱, retry, polling, 데이터 동기화, prefetching 등 많은 기능을 제공한다.이러한 기능들이 필요하지 않다면 괜찮지만, 그렇다고 해서 React Query를 사용하지 말아야 한.. wono | discuss | tweet + it dev react state 어떤 상황에서 Zustand와 Jotai를 선택해야 할까?Frontend, React 클라이언트 상태 관리 도구 선택 가이드: Zustand vs Jotai wono | discuss | tweet + it dev typescript javascript TypeScript compile and keep commentsI like to have my comments intact in the resulting javascript file, by default the compiler removes them. Is there a tsc parameter for that? (The use case is to keep /// reference path's = ... for wono | discuss | tweet + it dev nextjs interceptor Introduce experimental Request Interceptors by unstubbable · Pull Request #70961 · vercel/next.jsNoteThis API is unstable and might change or not be shipped as stable. This PR introduces Request Interceptors as a complementary solution to Middleware. They allow users to run code at the origin... wono | discuss | tweet + it dev nextjs auth role How to Configure Secure Routes Using Next.js Middleware — the right way!Protecting routes in frontend has always been a daunting task for me anytime I have to work on authentication-based applications— in Next.js. Not because the solution doesn't exist out there on the… wono | discuss | tweet + it ops aws s3 [AWS] 📚 S3 개념 & 버킷 · 권한 설정 방법S3 (Simple Storage Service) 개념 AWS S3는 업계 최고의 확장성과 데이터 가용성 및 보안과 성능을 제공하는 온라인 오브젝트(객체) 스토리지 서비스이다. (참고로 S 앞글자가 3개라서 S3 이라고 한다.) 쉽게 말하자면, 스토리지 즉 구글 드라이브 처럼 파일 저장 서비스이며, 데이터를 온라인으로 오브젝트 형태로 저장하는 서비스라고 보면 된다. 앞에 온라인이라는 글자가 붙는 이유는 데이터 조작에 HTTP/HTTPS를 통한 API가 사용되기 때문이다. 또한 편리한 UI 인터페이스를 통해 어디서나 쉽게 데이터를 저장하고 불러올 수 있어 개발자가 쉽게 웹 규모 컴퓨팅 작업을 수행할 수 있도록 한다. S3는 저장하는 데이터 양에 대한 비용도 저렴하고, 저장할 수 있는 데이터 양이 무한에 가.. wono | discuss | tweet + it dev kysely rawsql [Feature]: Allow executing raw queries with a more idiomatic way · Issue #455 · kysely-org/kyselyCurrently executing raw queries has the following structure sql`SELECT 1 AS result`.execute(kysely) It would be nice to have it the other way around as well as people naturally tend to think with the current instance first. kysely.execut... wono | discuss | tweet + it ops aws rds postgresql Amazon Aurora PostgreSQL 호환 버전 릴리스 정보 - Amazon AuroraAmazon Aurora PostgreSQL 호환 버전 릴리스 정보에 대해 알아봅니다. wono | discuss | tweet + it dev typescript tsconfig 📘 타입스크립트 컴파일 설정 - tsconfig 옵션 총정리타입스크립트 컴파일 설정 tsconfig.json은 타입스크립트를 자바스크립트로 변환 시키는 컴파일 설정을 한꺼번에 정의 해놓는 파일이라고 보면 된다. 프로젝트를 컴파일 하는데 필요한 루트 파일, 컴파일러 옵션 등을 상세히 설정할 수 있다. 보통 tsconfig.json 파일은 TypeScript 프로젝트의 루트 디렉토리(Root Directory)에 위치된다. 그래서 tsconfig.json 파일이 프로젝트에 있다면 vscode는 우리가 타입스크립트로 개발한다는 것을 인식하게 되는 것이다. tsconfig에서 옵션들을 미리 정의해 놓으면, 더이상 컴파일 할때 명령어에 일일히 대상 파일이나 옵션을 지정하지 않아도 된다. 그래서 tsc 나 ts-node 명령어를 그냥 실행하게 되면, 현재 폴더에 있는 ts.. wono | discuss | tweet + it dev nextjs modal [Next.js] 라우팅으로 모달 구현하기React에서는 모달을 구현해야 한다면 useState나 전역 상태를 통해 모달을 구현하였다. 그러나 Next.js에서는 별도의 상태없이 모달을 라우팅만으로도 구현할 수 있다. 라우팅만으로 모달을 구현하기 위해서는 Next.js가 제공하는 라우팅 방법 중 병렬 라우 wono | discuss | tweet + it dev github flow 좋은 git 커밋 메시지를 작성하기 위한 7가지 약속 : NHN Cloud Meetup기술을 공유하고 함께 성장해가는 개발 문화, NHN이 추구하는 가치입니다. wono | discuss | tweet + it dev github flow 깃 커밋 컨벤션 정하기git commit convention 정하기 커밋 메세지 란 커밋을 할 때, 현재 commit 이 정확히 무엇과 관련한 개발에 해당하고, 어떤 변경 사항이 있는지 등을 작성하는 것을 말합니다. 커밋 메세지의 간단한 예시를 보면 다음과 같습니다. (제목, 본문, 꼬리말이 모두 담겨있습니다.) Feat: "로그인 함수 추가" 로그인 요청을 위한 함수 구현 Closes: #123 커밋 메세지를 잘 작성하면, 우리는 단순히 커밋 이력만 보고서도 현재까지 어떤 개발이 진행되었고, 어떤 커밋에서 문제가 발생했는지 등을 확인할 수 있게 됩니다. 특히나 규모가 큰 개발일수록 이 커밋 메세지는 더욱 중요해집니다. TIP! 만약 커밋 메세지를 vim편집기에서 작성하고 싶다면 git commit 이라고만 입력하면 됩니다... wono | discuss | tweet + it dev github flow Merge 후 브랜치 삭제: 왜 그리고 어떻게Merge 과정 상세 설명 새 브랜치 생성: 메인 브랜치에서 git checkout -b <new-branch-name>으로 새 브랜치를 만든다. 브랜치에 커밋 추가: 새 브랜치에서 코드를 변경하고 의미 있는 단위로 커밋한다. 원격 저장소에 push: git push origin <branch-name>으로 작업한 브랜치를 원격에 업로드한다. Pull request 생성: GitHub 등에서 pull request를 만들어 변경사항 병합을 요청한다. 코드 리뷰 진행: 팀원들이 코드를 검토하고 필요시 수정을 요청한다. Merge 실행: 리뷰 완료 후 pull request를 메인 브랜치에 병합한다. 이 과정을 통해 팀은 코드 품질을 유지하며 효율적으로 협업할 수 있다. wono | discuss | tweet + it dev github flow 사례로 이해하는 GitHub FlowGitHub Flow는 GitHub을 활용하는 브랜치 전략으로, 브랜치를 어떻게 생성하고 병합하는지에 대한 개념입니다. GitHub Flow의 간단한 사용 사례를 통해 브랜치 전략을 이해해 봅시다. wono | discuss | tweet + it dev nextjs s3 Next.js 15에서 route api를 이용해 아마존 라이트세일 버킷(S3)에 이미지 올리기아마존 라이트세일의 S3 버킷 서비스를 활용한 이미지 업로드 구현 방법입니다. Next.js 15와 AWS SDK v3를 사용하여 라이트세일 버킷에 이미지를 업로드하고 URL을 반환하는 과정을 단계별로 정리했습니다. wono | discuss | tweet + it dev nextjs next.js tutorial - beginner to advanced🚀 Welcome to a new series on mastering Next.js, the React framework that's transforming web development! Are you ready to take your React skills to the next ... wono | discuss | tweet + it fe react19 React v19 – ReactThe library for web and native user interfaces wono | discuss | tweetNext
+ it dev nestjs naming file naming in nest.jsThis question is about code styling in Nestjs. This framework suggests file naming lowercase letters and across the dot. Example: file user.service.ts export class UserService { } another file imp... wono | discuss | tweet
+ it dev nestjs naming NestJS - 네이밍 규칙NestJS는 일반적으로 아래와 같은 규칙을 따른다. 1. 파일명은 .으로 연결하고, 둘 이상의 단어로 구성되어 있을 시 -로 연결 hello.controller.ts my-first.controller.ts 2. 클래스명은 카멜 케이스 사용 HelloController MyFirstController 3. 같은 디렉터리에 있는 클래스의 경우 index.ts 사용 // index.ts 미사용 import { HelloController } from './contrllers/hello.controller' import { MyFirstController } from './contrllers/my-first.controller' // index.ts 사용 import { HelloController, MyF.. wono | discuss | tweet
+ it dev react-query 6. React Query가 필요한 이유나는 React Query를 좋아한다. React Query가 React앱에서 비동기 상태를 다루는 방식을 단순화하기 때문이다. 하지만 가끔 서버에서 데이터를 페칭해오는 것처럼 "간단한" 작업에는 React Query가 필요하지 않다고 주장하는 글들을 볼 수 있다.React Query가 제공하는 모든 추가 기능이 필요한 것은 아니니까, useEffect 안에서 fetch를 사용하는 것만으로도 충분할 때 굳이 서드파티 라이브러리를 추가하고 싶지 않다는 것이다. 이는 어느 정도 맞는 말이다.React Query는 캐싱, retry, polling, 데이터 동기화, prefetching 등 많은 기능을 제공한다.이러한 기능들이 필요하지 않다면 괜찮지만, 그렇다고 해서 React Query를 사용하지 말아야 한.. wono | discuss | tweet
+ it dev react state 어떤 상황에서 Zustand와 Jotai를 선택해야 할까?Frontend, React 클라이언트 상태 관리 도구 선택 가이드: Zustand vs Jotai wono | discuss | tweet
+ it dev typescript javascript TypeScript compile and keep commentsI like to have my comments intact in the resulting javascript file, by default the compiler removes them. Is there a tsc parameter for that? (The use case is to keep /// reference path's = ... for wono | discuss | tweet
+ it dev nextjs interceptor Introduce experimental Request Interceptors by unstubbable · Pull Request #70961 · vercel/next.jsNoteThis API is unstable and might change or not be shipped as stable. This PR introduces Request Interceptors as a complementary solution to Middleware. They allow users to run code at the origin... wono | discuss | tweet
+ it dev nextjs auth role How to Configure Secure Routes Using Next.js Middleware — the right way!Protecting routes in frontend has always been a daunting task for me anytime I have to work on authentication-based applications— in Next.js. Not because the solution doesn't exist out there on the… wono | discuss | tweet
+ it ops aws s3 [AWS] 📚 S3 개념 & 버킷 · 권한 설정 방법S3 (Simple Storage Service) 개념 AWS S3는 업계 최고의 확장성과 데이터 가용성 및 보안과 성능을 제공하는 온라인 오브젝트(객체) 스토리지 서비스이다. (참고로 S 앞글자가 3개라서 S3 이라고 한다.) 쉽게 말하자면, 스토리지 즉 구글 드라이브 처럼 파일 저장 서비스이며, 데이터를 온라인으로 오브젝트 형태로 저장하는 서비스라고 보면 된다. 앞에 온라인이라는 글자가 붙는 이유는 데이터 조작에 HTTP/HTTPS를 통한 API가 사용되기 때문이다. 또한 편리한 UI 인터페이스를 통해 어디서나 쉽게 데이터를 저장하고 불러올 수 있어 개발자가 쉽게 웹 규모 컴퓨팅 작업을 수행할 수 있도록 한다. S3는 저장하는 데이터 양에 대한 비용도 저렴하고, 저장할 수 있는 데이터 양이 무한에 가.. wono | discuss | tweet
+ it dev kysely rawsql [Feature]: Allow executing raw queries with a more idiomatic way · Issue #455 · kysely-org/kyselyCurrently executing raw queries has the following structure sql`SELECT 1 AS result`.execute(kysely) It would be nice to have it the other way around as well as people naturally tend to think with the current instance first. kysely.execut... wono | discuss | tweet
+ it ops aws rds postgresql Amazon Aurora PostgreSQL 호환 버전 릴리스 정보 - Amazon AuroraAmazon Aurora PostgreSQL 호환 버전 릴리스 정보에 대해 알아봅니다. wono | discuss | tweet
+ it dev typescript tsconfig 📘 타입스크립트 컴파일 설정 - tsconfig 옵션 총정리타입스크립트 컴파일 설정 tsconfig.json은 타입스크립트를 자바스크립트로 변환 시키는 컴파일 설정을 한꺼번에 정의 해놓는 파일이라고 보면 된다. 프로젝트를 컴파일 하는데 필요한 루트 파일, 컴파일러 옵션 등을 상세히 설정할 수 있다. 보통 tsconfig.json 파일은 TypeScript 프로젝트의 루트 디렉토리(Root Directory)에 위치된다. 그래서 tsconfig.json 파일이 프로젝트에 있다면 vscode는 우리가 타입스크립트로 개발한다는 것을 인식하게 되는 것이다. tsconfig에서 옵션들을 미리 정의해 놓으면, 더이상 컴파일 할때 명령어에 일일히 대상 파일이나 옵션을 지정하지 않아도 된다. 그래서 tsc 나 ts-node 명령어를 그냥 실행하게 되면, 현재 폴더에 있는 ts.. wono | discuss | tweet
+ it dev nextjs modal [Next.js] 라우팅으로 모달 구현하기React에서는 모달을 구현해야 한다면 useState나 전역 상태를 통해 모달을 구현하였다. 그러나 Next.js에서는 별도의 상태없이 모달을 라우팅만으로도 구현할 수 있다. 라우팅만으로 모달을 구현하기 위해서는 Next.js가 제공하는 라우팅 방법 중 병렬 라우 wono | discuss | tweet
+ it dev github flow 좋은 git 커밋 메시지를 작성하기 위한 7가지 약속 : NHN Cloud Meetup기술을 공유하고 함께 성장해가는 개발 문화, NHN이 추구하는 가치입니다. wono | discuss | tweet
+ it dev github flow 깃 커밋 컨벤션 정하기git commit convention 정하기 커밋 메세지 란 커밋을 할 때, 현재 commit 이 정확히 무엇과 관련한 개발에 해당하고, 어떤 변경 사항이 있는지 등을 작성하는 것을 말합니다. 커밋 메세지의 간단한 예시를 보면 다음과 같습니다. (제목, 본문, 꼬리말이 모두 담겨있습니다.) Feat: "로그인 함수 추가" 로그인 요청을 위한 함수 구현 Closes: #123 커밋 메세지를 잘 작성하면, 우리는 단순히 커밋 이력만 보고서도 현재까지 어떤 개발이 진행되었고, 어떤 커밋에서 문제가 발생했는지 등을 확인할 수 있게 됩니다. 특히나 규모가 큰 개발일수록 이 커밋 메세지는 더욱 중요해집니다. TIP! 만약 커밋 메세지를 vim편집기에서 작성하고 싶다면 git commit 이라고만 입력하면 됩니다... wono | discuss | tweet
+ it dev github flow Merge 후 브랜치 삭제: 왜 그리고 어떻게Merge 과정 상세 설명 새 브랜치 생성: 메인 브랜치에서 git checkout -b <new-branch-name>으로 새 브랜치를 만든다. 브랜치에 커밋 추가: 새 브랜치에서 코드를 변경하고 의미 있는 단위로 커밋한다. 원격 저장소에 push: git push origin <branch-name>으로 작업한 브랜치를 원격에 업로드한다. Pull request 생성: GitHub 등에서 pull request를 만들어 변경사항 병합을 요청한다. 코드 리뷰 진행: 팀원들이 코드를 검토하고 필요시 수정을 요청한다. Merge 실행: 리뷰 완료 후 pull request를 메인 브랜치에 병합한다. 이 과정을 통해 팀은 코드 품질을 유지하며 효율적으로 협업할 수 있다. wono | discuss | tweet
+ it dev github flow 사례로 이해하는 GitHub FlowGitHub Flow는 GitHub을 활용하는 브랜치 전략으로, 브랜치를 어떻게 생성하고 병합하는지에 대한 개념입니다. GitHub Flow의 간단한 사용 사례를 통해 브랜치 전략을 이해해 봅시다. wono | discuss | tweet
+ it dev nextjs s3 Next.js 15에서 route api를 이용해 아마존 라이트세일 버킷(S3)에 이미지 올리기아마존 라이트세일의 S3 버킷 서비스를 활용한 이미지 업로드 구현 방법입니다. Next.js 15와 AWS SDK v3를 사용하여 라이트세일 버킷에 이미지를 업로드하고 URL을 반환하는 과정을 단계별로 정리했습니다. wono | discuss | tweet
+ it dev nextjs next.js tutorial - beginner to advanced🚀 Welcome to a new series on mastering Next.js, the React framework that's transforming web development! Are you ready to take your React skills to the next ... wono | discuss | tweet
+ it fe react19 React v19 – ReactThe library for web and native user interfaces wono | discuss | tweet