3:24 5/23
trend21c.tistory.com
3:24
trend21c.tistory.com
나를 찾는 아이http://trend21c.tistory.com
Simple is the best, Go to basic
저작도구: tistory
최종 피드 수집: 2024-12-27 14:15
전체 (166)
9M
9M
nestjs swagger가 아니라 redoc 적용하기
swagger live demoredoc live demo
우리가 많이 사용하고 있는 openapi를 볼수 있는 UI 툴은 잘 알려진 swagger가 있지만,
그의 대체제인 redoc도 있다는것 아셨나요?
이것
BACKEND
NestJS
nodejs
+ 더보기
openapi
redoc
swagger
9M
10M
더 나은 TS/JS 코드 작성을 위해 피해야할것 4가지
1. 타입 추론이 어려운 비어있는 오브젝트로의 초기화, null 초기화를 피해주세요// ❌ 작성자의 변수 선언 의도를 알수 없음
const wrongTypeVariable1 = {} // const wrongTypeVariabl
NODEJS
JavaScript
TypeScript
+ 더보기
자바스크립트
타입스크립트
10M
11M
11M
11M
아임포트 테스트환경 결제수단별 제약사항
사실 결제모듈이라는게 처음 서비스 셋업하고 잘 바꾸지 않는 케이스가 더 많기 때문에 한번 셋업한 이후로는 셋업하는 방법이나 관련 내용에 대해서 잊어버릴때가 많더라구요이번에 많이들 사용하시는 결제모듈인 아임포트를 사용하면서 다
정보
iamport
PG
+ 더보기
가상계좌
결제
결제모듈
네이버페이
아임포트
카카오페이
토스페이
페이코
11M
11M
11M
11M
1y
1y
1y
1y
1y
1y
1y
1y
1y
[typescript] optional 속성에 undefined를 할당할수 있을까?
typescript의 옵션중에서 exactOptionalPropertyTypes 옵션이 있습니다이 옵션은 기본적으로는 disabled 상태입니다
이 옵션이 무슨 옵션인지 한번 알아볼까요
일단 exactOptionalP
프로그래밍
exactOptionalPropertyTypes
Optional
+ 더보기
TypeScript
undefined
타입스크립트
1y
1y
1y
npm 특정 버전의 패키지를 사용하도록 지정하기
npm 은 hoisting 알고리즘을 통해 여러버전의 패키지들을 관리하고 있습니다여러분의 프로젝트에서 관리하고 있는 의존성중에서
특정 패키지의 버전을 다른 버전을 쓰도록 바꾸고 싶을때가 있을수 있습니다
예를 들면 어떤
REACTJS
node_modules
NPM
+ 더보기
react
yarn
의존성
1y
당신의 REST API는 멱등한가요?
멱등이라는 단어는 사실상 평생 쓸 일이 없는 단어입니다그런데 HTTP method 에서 멱등성이라는 아주 생소한 단어가 등장하는데요
이것을 알면 더 좋은 http restful api를 설계하는데 큰 도움이 됩니다
추
BACKEND
API
delete
+ 더보기
HTTP
method
Patch
post
Put
RESTAPI
멱등
1y
phpMyAdmin말고 adminer도 있네
https://www.adminer.org/새로운 데이터베이스 매니지먼트 ui 툴 adminer를 소개합니다
메인 카피가 아주 심플한데요
Database management in single PHP file.
딱 1개
BACKEND
adminer
docker
+ 더보기
php
phpmyadmin
1y
1y
1y
1y
mysql의 date 타입을 javscript의 date로 사용한다면 조심해주세요
mysql을 nodejs에서 사용할때는 가장 유명한패키지 2개가 있습니다https://www.npmjs.com/package/mysql2
https://www.npmjs.com/package/mysql2
두개 모두 위클리
BACKEND
date
datetime
+ 더보기
KST
MySQL
string
timestamp
utc
1y
1y
1y
aws에서 nodejs 16버전을 쓰고 싶으시다구요?
그렇습니다amazon linux2 의 x86_64 표준 4:0 에서 nodejs 16 런타임이 동작합니다
실행환경을 변경해주세요
BACKEND
AWS
nodejs
+ 더보기
nodejs16
1y
1y
1y
1y
1y
1y
1y
javascript로 글자수 세기 위한 노력
string 타입의 문자열의 길이를 어떻게 구할수 있을까요?무척이나 간단합니다
"hello".length // 5
이렇게 셀수 있어요
그러면 영어말고 한글은 어떻게 될까요?
"안녕하세요".length /
프로그래밍
JavaScript
TypeScript
+ 더보기
글자수
유니코드
자바스크립트
타입스크립트
한글
1y
bull UI 로 bull-board를 써보시길 추천합니다
AWS SQS를 비롯한 여러종류의 메시지 큐중 하나를 선택하여 여러분의 서비스를 개발하실때 쓰실텐데요https://github.com/OptimalBits/bull
nodejs환경과 redis 베이스의 bull 이라는 큐
NODEJS
bull
bull-board
+ 더보기
express
NestJS
redis
큐
1y
1y
1y
typescript optional 오남용 금지
optional은 코딩에 있어서 굉장한 편리함을 줍니다그런데 가끔 optional을 굳이 사용하지 않아도 되는곳에도 optional을 오남용하는 곳을 볼수 있습니다
뭐 이런 함수가 있다고 생각해봅시다
세번째 매개변
function
Optional
TypeScript
+ 더보기
타입스크립트
1y
1y
as const 로 object를 견고하게 만들기
const ProductStatus = {SoldOut : "SOLDOUT",
Sales: "SALES",
}
이렇게 object를 이용하여 ProductStatus의 값을 설정하였다고 가정해봅시다
우리는 앞으로
프로그래밍
JavaScript
TypeScript
+ 더보기
자바스크립트
타입스크립트
1y
1y
typescript의 인터페이스는 javscript에는 없습니다
typescript에서 당연하게 이용하는것이 interface 입니다인터페이스는 추상화, 다형성에 있어서 매우 의미있는 역할을 하고 있습니다
그런데 typescript의 인터페이스는 javascript에는 없다는 사실 알
프로그래밍
Interface
JavaScript
+ 더보기
TypeScript
다형성
인터페이스
자바스크립트
타입스크립트
1y
aws cloudfront에서 index.html의 캐싱을 막자
cloudfront의 배포를 선택한뒤 동작에서 여러 경로에 대한 동작을 지정할수 있습니다동작이라 함은 특정 값을 파라메터로 보내거나 캐시에 대한 내용을 수정할수 있습니다
여러분이 react와 같은 frontend를 배포할
AWS
cache
Caching
+ 더보기
CloudFront
frontend
react
S3
vuejs
캐쉬
캐시
1y
react javascript에서 typescript로 점진적 전환하기
이제는 더이상 typescript를 주저할 이유가 없습니다기존에 만든 javascript 로 되어있는 react 프로젝트를 typescript로 전환하세요
cra로 생성을 한 경우 매우 쉽게 전환이 가능합니다
먼저
REACTJS
JavaScript
react
+ 더보기
TypeScript
리액트
자바스크립트
타입스크립트
1y
1y
nestjs API Rate Limit 적용하기
nestjs에는 nestjs/throttler라는 기본패키지를 제공하고 있어API의 과도한 호출을 막기 위한 API Rate Limit을 쉽게 적용할수 있습니다
$ npm i --save @nestjs/throttler
BACKEND
NestJS
throttler
+ 더보기
throttling
스로틀링
쓰로틀링
1y
1y
ant design 3.x theme customize
https://3x.ant.design/docs/react/use-with-create-react-app아직 antd 3.x 을 사용하는 프로젝트가 있습니다
이미 5.x이 출시되었는데 말이죠 ㅠ
antd는 메인
FRONTEND
antd
antdesign
+ 더보기
customize
Primary
theme
2y
2y
구글태그매니저(GTM)를 통해 GA4 연동하기
https://support.google.com/tagmanager/answer/6102821?hl=koGA4 스크립트를 직접 내 웹사이트에 넣는 방법도 있지만 좀 더 멋지게 사용할수 있는 방법입니다
구글 태그매니저를
FRONTEND
Analytics
GA4
+ 더보기
gtm
구글
구글태그매니저
애널리틱스
2y
2y
2y
GA4 실시간 디버깅하기
GA4를 설치하였다면 정상적으로 이벤트가 전달되는지 테스트를 해봐야겠죠?실시간 디버깅을 해봅시다
먼저 여러분의 웹사이트에 GA4 스크립트를 넣어야겠죠?
nextjs에서 사용할수 있는 스크립트입니다
<
FRONTEND
Analytics
Debug
+ 더보기
GA4
디버그
디버그뷰
실시간
애널리틱스
2y
웹사이트에 ga4 설치하기
GA4의 설치는 애널리틱스 계정을 생성하고 웹페이지에 GA의 스크립트를 추가하는것으로부터 시작합니다좌측 하단의 관리자를 클릭후 데이터 스트림 메뉴를 선택하세요
생성되어있는 스트림을 선택합니다
생성되어있는것이 없다면
FRONTEND
analtytics
GA4
+ 더보기
Google
NextJs
react
2y
2y
nestjs @typescript-eslint/no-unused-vars 가 자꾸 괴롭힐때
import { Module } from '@nestjs/common';import { AppController } from './app.controller';
import { AppService } from './app.ser
NODEJS
@typescript-eslint/no-unused-vars
eslint
+ 더보기
NestJS
TypeScript
2y
2y
2y
2y
2y
react 18 typescript type에 PropsWithChildren가 추가되었습니다
react 18 types에 PropsWithChildren 이라는 타입이 추가되었습니다말그대로 children을 포함한 props를 가리키는 타입입니다
코드를 보면 이런식으로 선언이 되어있습니다
type PropsW
REACTJS
PropsWithChildren
react
+ 더보기
TypeScript
2y
2y
애플 스마트 앱배너(smart app banner) 달아보세요
애플 스마트 앱배너 알고 계신가요?그래도 나온지 꽤 오래된 기능인데
아직 그렇게 많이 쓰지는 않는것 같아요
디자인적으로 커스터마이징을 할수 없다는 이유도 있고, 트래킹 관련한 애로사항도 이유가 있을것 같습니다
WEB2.0
appbanner
ios
+ 더보기
Safari
스마트앱배너
애플
앱배너
2y
nodejs의 논블로킹(non-blocking) 체감하기
nodejs는 싱글스레드이며, 논블로킹이다 라는것은 nodejs를 공부하는 사람이라면 항상듣는 개념입니다그런데 막상 코드를 짤때 이부분을 간과하는 경우가 많습니다
그래서 한번 어떻게 논블로킹하게 생각하고 코딩해야되는지
NODEJS
nodejs
non-blocking
+ 더보기
thread
넌블러킹
논블로킹
2y
[nestjs] versioning 기능 이용하기
https://docs.nestjs.com/techniques/versioning#versioningrest api를 설계할때 아래와 같이 버전을 포함하여 url을 설계할수 있습니다
POST /v1/users
GET /v
BACKEND
NestJS
RESTAPI
+ 더보기
Versioning
버저닝
2y
[nestjs] whitelist 로 파라메터를 안전하게 사용하기
nestjs의 dto는 우리가 별다른 노력을 들이지 않아도 입력값을 자동으로 dto 클래스에 매핑을 하여손쉽게 사용할수 있도록 도와줍니다
export class CreateUserDto {
username: strin
BACKEND
NestJS
validation
+ 더보기
validationpipe
Whitelist
2y
[nestjs] validation error 핸들링
nestjs는 class-validator와 함께 강력한 validationpipe 기능을 제공하고 있습니다dto를 통해서 입력된 값의 validation을 체크할수 있습니다
export class CreateUse
BACKEND
class-validator
NestJS
+ 더보기
validationpipe
2y
2y
2y
2y
2y
[nestjs] ClassSerializerInterceptor 전체 적용하기
웹어플리케이션은 요청에 대한 응답결과를 client에 object 또는 object의 array 형태로 전달합니다그런데 이러한 값을 뭔가 특정 룰에 의해 공통적으로 관리하고 싶습니다
예를 들면 password같은 결코
NODEJS
classserializerinterceptor
Interceptor
+ 더보기
NestJS
nodejs
Serialize
2y
2y
2y
2y
2y
2y
2y
무료 서버 제공주는 곳 정보 푼다
https://vercel.com/nextjs를 만든 vercel입니다
react, vue, nextjs를 비롯해서 내가 만든 개발한 웹어플리케이션을 repository 연결만으로 쉽게 배포하여 서비스가 가능합니다
n
프로그래밍
EC2
MySQL
+ 더보기
PostgreSQL
redis
무료
2y
2y
2y
2y
2y
2y
2y
2y
2y
2y