TS4 [React/Typescript] react-chatbot-kit으로 챗봇 개발하기 2 (기능 편) UI 편 ⬇️https://bookcord.tistory.com/36 [React/Typescript] react-chatbot-kit으로 챗봇 개발하기 (UI 편)📍 공식 문서https://fredrikoseberg.github.io/react-chatbot-kit-docs/docs/getting-started Getting Started | React-chatbot-kitStep 1: Install react-chatbot-kitfredrikoseberg.github.io 공식 문서에 나와있는대로 아래의 세 가지 단계bookcord.tistory.com KT wiz 웹페이지 개선 프로젝트에서, 추가할 기능으로 챗봇을 넣기로 했었다. 그런데 멘토님께서 챗봇은 api가 없기 때문에 그냥 안해도 된다고.. 2025. 1. 28. [React/Typescript] react-chatbot-kit으로 챗봇 개발하기 1 (UI 편) 📍 공식 문서https://fredrikoseberg.github.io/react-chatbot-kit-docs/docs/getting-started Getting Started | React-chatbot-kitStep 1: Install react-chatbot-kitfredrikoseberg.github.io 공식 문서에 나와있는대로 아래의 세 가지 단계를 수행했다.이때 나는 타입스크립트로 개발 중이므로, 각각 ts와 tsx로 작성해야했다. (여기서부터 개큰 고난 시작)타입스크립트는 자바스크립트와 달리 모든 매개변수의 타입을 지정해줘야하기 때문이다. /* config.ts */import { createChatBotMessage } from 'react-chatbot-kit';const conf.. 2025. 1. 28. [Typescript] 문자열 내 괄호의 개수 계산하기 function processPlayerData(data: string): string[] { if (data.split('(').length - 1 > 1) { // 괄호가 2개 이상인 경우 (여러 선수 데이터) return data.split(' '); } else { // 괄호가 1개인 경우 (한 선수 데이터) return [data]; }}// 테스트const multiplePlayers = "신민재(3회) 박해민(7회) 김대원(7회)";const singlePlayer = "오스틴(1회 1사 1루서 우중간 2루타)";console.log(processPlayerData(multiplePlayers)); // 출력: ['신민재(3회)', '박해민(7회)', '김대원(7회.. 2024. 12. 26. [React/트러블슈팅] 컴포넌트를 반복문으로 렌더링 할 때 key를 지정하면서 발생했던 오류 해결 Kt wiz 웹페이지 개선 프로젝트를 하면서, 컴포넌트를 반복문을 통해 렌더링해야했다. 리액트에서는 컴포넌트를 반복문을 통해 렌더링할 때 Key를 지정해주어야한다. 그래서 처음에 배열의 인덱스를 Key로 지정했다. import React from 'react';import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui';import { BoxScoreData } from './BoxScoreData';interface MatchScoreTableProps { data: BoxScoreData;}const MatchScoreTable: React.FC = ({ data }) => { const.. 2024. 12. 20. 이전 1 다음
