본문 바로가기
반응형

분류 전체보기

 (9429)
React 17.0.2, TypeScript 4.3.5, Recharts 2.1.5를 사용한 클래스형 컴포넌트로 구현 React 17.0.2, TypeScript 4.3.5, Recharts 2.1.5를 사용한 클래스형 컴포넌트로 구현ag-Grid를 사용한 데이터 표시상단 메뉴바, 좌측 네비게이션, 메인 컨텐츠 영역으로 구성된 레이아웃대시보드와 코드 관리 페이지 구현npm install react@17.0.2 react-dom@17.0.2 typescript@4.3.5 recharts@2.1.5 ag-grid-react ag-grid-community react-router-dom axios 1. 기본 인터페이스 및 타입 정의 (types.ts)// types.tsexport interface User { name: string; image?: string; corporation: string; departmen..
React 17 챠트 에제 클래스형 컴퍼넌트 import React, { Component } from 'react';import axios from 'axios';import { BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer, Cell, LabelList} from 'recharts';import { RefreshCw } from 'lucide-react';// 타입 정의interface DashboardState { testPlan: { scenario: { mapped: number, total: number }, testCase: { mapped: number, total: number }, activity: { mapp..
LM Studio 설치 가이드 1. 시스템 요구사항운영체제:Windows 10 이상 (64-bit)macOS 11 이상 (Apple Silicon 또는 Intel)Linux (Ubuntu, Debian, Arch 등)메모리(RAM): 최소 8GB (16GB 이상 권장)저장공간: 모델에 따라 수 GB ~ 수십 GB 필요GPU: 선택 사항 (CPU 모드도 가능, GPU 사용 시 속도 향상)2. LM Studio 다운로드공식 사이트 접속:https://lmstudio.ai페이지 하단 또는 상단의 Download 버튼 클릭운영체제에 맞는 설치파일 선택 후 다운로드:Windows: LM_Studio_Setup.exemacOS: LM_Studio.dmgLinux: .AppImage 또는 .deb 파일3. 설치 과정🔹 Windows다운로드한 L..
React17, Typescript 생성 프로젝트 생성 : 저는 디렉토리는 생성 했음.npx create-react-app . --template typescriptex)npx create-react-app my-app --template typescriptcd my-app 오류발생 npm install --save-dev @types/react@17.0.38 @types/react-dom@17.0.2 npm install typescript@4.3.5 --save-dev "recharts": "^2.1.5",
React 17.0.2 모달 창 띄우기(클래스형) 1. App.tsx (메인 컴포넌트)React.Component를 상속받는 클래스로 변경상태(state)와 속성(props) 타입 인터페이스 정의생성자에서 초기 상태 설정 및 메소드 바인딩함수형 컴포넌트의 useEffect 대신 componentDidMount 사용상태 업데이트를 위해 this.setState 사용2. ViewSqlModal.tsx클래스형 컴포넌트로 변환상태와 속성 인터페이스 정의생성자에서 초기 상태와 메소드 바인딩 설정함수형 컴포넌트의 useState 훅 대신 클래스 상태 관리 사용3. AddPartnerModal.tsx클래스형 컴포넌트로 변환react-hook-form 대신 내부 상태로 검색 필드 관리폼 제출 이벤트 핸들러 추가인풋 필드 변경 핸들러 구현주요 코드 변경 포인트상태 관리..
React 17.0.2 모달 창 띄우기(함수형) App.tsx import React, { useState, useEffect } from 'react';import { AgGridReact } from 'ag-grid-community';import 'ag-grid-community/dist/styles/ag-grid.css';import 'ag-grid-community/dist/styles/ag-theme-alpine.css';import { ViewSqlModal } from './components/ViewSqlModal';import { AddPartnerModal } from './components/AddPartnerModal';import './App.css';// 메인 그리드 데이터 타입 정의interface MainRowData {..
React 17.0.2 typescript 생성하는 방법 1. Node.js 설치먼저 Node.js가 설치되어 있어야 합니다.https://nodejs.org/ 에서 LTS 버전 설치 후, 아래 명령으로 확인하세요:node -vnpm -v2. TypeScript 기반 React 프로젝트 생성 (React 17.0.2 강제)CRA(Create React App)는 기본적으로 React 18을 설치하지만, 아래와 같이 수동으로 React 17.0.2로 설정할 수 있습니다.bash복사편집npx create-react-app frontend --template typescript cd frontend 이후, React 18 버전으로 설치된 경우, React 17로 다운그레이드 합니다:npm install react@17.0.2 react-dom@17.0.2CRA에 맞..
LG 폰트 다운로드 https://www.lge.co.kr/company/info/brandAsset 브랜드 Asset | 브랜드 | 기업정보 | 회사소개 | LG전자 www.lge.co.kr
반응형

티스토리툴바