본문 바로가기

분류 전체보기1350

[NestJs] ValidationPipe로 유효성 검사하기 안녕하세요. 오늘은 API 요청을 처리하기 전에 ValidationPipe를 사용하여 미리 요청한 값을 검사하는 로직을 짜보겠습니다. 먼저 npm install class-validator class-transformer 유효성 검사를 위해 위 라이브러리를 설치해주세요. 그리고 전 시간에 작성한 board.dto.ts 파일에서 유효성 검사의 조건을 입력하겠습니다. import { IsNotEmpty, IsString } from "class-validator"; export class CreateBoardDto { @IsNotEmpty() @IsString() title: string; @IsNotEmpty() @IsString() description: string; } @IsNotEmpty()그리고 .. 2024. 3. 9.
[Javascript] Color Flipper 만들기 오늘은 Js를 이용해 Color Flipper을 만들겠습니다. app.js파일은 고정된 수의 색상값이 있고, 이 중에서 하나를 무작위로 골라 배경색과 텍스트를 업데이트하는 코드입니다. hex.js파일은 무작위 16진수 색상을 생성하고 배경색과 텍스트를 업데이트하는 코드입니다. index.html color flipper simple hex background color : #f1f5f8 click me app.js const colors = ["green", "red", "rgba(133,122,200)", "#f15025"]; // 색상 배열을 정의합니다. 이 배열의 색상들은 배경색으로 사용됩니다. const btn = document.getElementById("btn"); const color = .. 2024. 3. 8.
[HTML/CSS] CTA 만들기 안녕하세요 이번 게시글에서는 HTML, CSS를 활용해서 CTA를 만들어보겠습니다. CTA란 Call to action의 약자로 유저의 즉각적인 반응을 유도하거나 즉각적인 판매를 장려하기 위한 마케팅 용어입니다. 보통 메인 페이지에 서비스를 설명할 수 있는 페이지로 이동하게끔 하는 버튼을 놓거나 사진을 배치하는 편입니다. 우선 구현하려고하는 CTA 예시입니다. 다음은 전체 코드입니다. Mother earth hosts your travel The state of Utah in the United States is home to lots of beautiful National Parks, Bryce National Canyon Park ranks as three of the most magnificent .. 2024. 3. 7.
[C#][.NET Core] 윈도우 앱 개발환경 세팅 및 테스트 오늘은 C# 언어를 사용해서 윈도우 프로그램을 만들기 위한 전 작업을 진행해보겠습니다. - Visual Studio 다운로드 : https://visualstudio.microsoft.com/ko/thank-you-downloading-visual-studio/?sku=Community&channel=Release&version=VS2022&source=VSLandingPage&cid=2030&passive=false - Visual Studio Code 다운로드 : https://code.visualstudio.com/ 저는 Visual Studio Code가 설치되어 있어 이 툴로 진행하겠습니다. 먼저 Visual Studio Code에서 확장 프로그램으로 이동해서 Microsoft 사에서 제공하는 .. 2024. 3. 6.
[Javascript] 다운로드 이미지 미리보기 만들기 오늘은 이미지 다운로드 미리보기를 만들어보겠습니다. 오늘 알아볼 JavaScript 속성 download 속성은 태그가 링크된 리소스를 다운로드하기 위해 사용됩니다. 이 속성에 값(이 경우 'downloadedImage.jpg')을 지정하면, 사용자가 링크를 클릭할 때 해당 파일이 다운로드됩니다. 여기서 지정된 값은 다운로드될 파일의 이름을 나타내며, 사용자의 디바이스에 저장될 때 이 이름을 사용합니다. download 속성이 빈 문자열이거나 설정되지 않으면, 원본 파일 이름이 사용됩니다. 하지만 특정 값을 제공하면, 그 값이 다운로드 파일의 이름으로 사용됩니다 appendChild appendChild 메서드는 한 노드(여기서는 태그)를 특정 부모 노드의 자식으로 문서에 추가합니다. 이 경우 docum.. 2024. 3. 5.
[C++] 아두이노 조이스틱 모듈 사용하기 이번 시간에는 아두이노로 조이스틱 모듈을 사용해보겠습니다. 아두이노에 대해 기본적인 내용을 알고 싶다면 아래 게시글을 참고해주세요. https://stickode.tistory.com/1044 [C++] 아두이노로 서보 모터 사용하기 이번 시간에는 아두이노로 서보 모터 사용하는 예제를 진행하겠습니다. 1. 아두이노란? 아두이노(Arduino)는 사용하기 쉬운 하드웨어와 소프트웨어를 기반으로 한 오픈 소스 전자 플랫폼입니다. stickode.tistory.com 1. 조이스틱 모듈이란? 두개의 가변저항을 사용하여 조이스틱의 움직임을 감지하고 해당 값들을 아날로그 신호로 전달하는 센서입니다. 2. 회로도 3. 소스 코드 void setup() { Serial.begin(9600); // 시리얼 통신을 시작하.. 2024. 3. 4.
[Python] FastAPI를 사용해서 서버 만들기 https://stickode.tistory.com/1051 https://stickode.tistory.com/1062 저번 시간에 이어서, 오늘은 DB에 저장해둔 데이터를 시각화해보겠습니다. 코드에서 user와 password는 본인의 DB 설정에 맞게 변경하셔야합니다. MariaDB에는 다음과 같은 테이블을 추가하시면 됩니다. CREATE TABLE trades ( type VARCHAR(50), code VARCHAR(20), timestamp BIGINT, trade_date DATE, trade_time TIME, trade_timestamp BIGINT, trade_price DECIMAL(20, 4), trade_volume DECIMAL(20, 8), ask_bid VARCHAR(10),.. 2024. 3. 3.
[Python]파이썬의 가변 인자: *args와 **kwargs 이해하기 파이썬은 그 유연성과 사용의 용이성으로 유명합니다. 이 중 하나의 강력한 기능은 함수의 인자로 `*args`와 `**kwargs`를 사용하는 것입니다. 이 두 표현은 파이썬에서 가변 인자를 처리하는 방법을 제공합니다. 이번 포스트에서는 이들의 사용법과 작동 원리를 자세히 살펴보겠습니다. `*args` - 위치 인자의 가변성 `*args`는 함수가 임의의 개수의 위치 인자를 받을 수 있도록 해줍니다. 이를 사용하면 함수 호출 시 제공하는 인자의 수가 고정되어 있지 않아도 됩니다. 함수 내부에서 `args`는 튜플로 처리되며, 전달된 모든 위치 인자를 포함합니다. def print_args(*args): for arg in args: print(arg) print_args('Hello', 'Python', .. 2024. 3. 2.
[JavaScript] OpenWeatherMap API 사용하여 입력한 도시의 날씨를 기반으로 옷차림이나 활동 추천하기 안녕하세요 오늘은 OpenWeatherMap API 사용하여 입력한 도시의 날씨를 기반으로 옷차림이나 활동 추천하는 서비스를 구현해보겠습니다. OpenWeatherMap API 를 사용하려면 https://openweathermap.org/ 에서 무료로 api 키를 발급받아야 합니다. api키를 발급 받은 후 index.html 파일에 다음과 같이 코드를 작성해줍니다. 날씨 기반 추천 추천 받기 그다음 script.js 파일에 다음과 같이 코드를 작성해 줍니다. async function fetchWeatherAndRecommend() { let city = document.getElementById('city-input').value.trim(); if (city) { let apiKey = 'b263.. 2024. 3. 1.

티스토리툴바