ReactFileStructure (42) 썸네일형 리스트형 초기 화면 네비게이터 형식으로 마크다운 문서의 리스트보기 좋게 잘 바꿔보자 React, Express 서버 간의 통신 React와 Express 서버 간의 통신은 **프론트엔드(React)**와 백엔드(Express) 간의 데이터 흐름을 의미합니다. 프론트엔드에서 사용자 인터페이스(UI)를 통해 작업을 수행하면, 백엔드가 해당 요청을 처리하고 데이터를 반환합니다. 아래에서 React와 Express 간 통신의 원리와 구현 방법을 자세히 설명하겠습니다.1. 통신의 기본 구조React(프론트엔드):사용자로부터 입력을 받고, HTTP 요청(fetch 또는 Axios)을 통해 Express 서버로 데이터를 전송합니다.Express 서버에서 반환된 데이터를 받아 UI를 업데이트합니다.Express(백엔드):React에서 받은 요청을 처리합니다.데이터베이스에서 데이터를 가져오거나 파일을 읽는 등의 작업을 수행한 뒤, React에 .. 파일 기반 문서 관리 - markdown 화면에 띄울 텍스트나 문서를 코드 또는 문자열 형식으로 작성할 수도 있지만, 더 좋은 방법은 데이터베이스에 저장하거나 파일로 관리하는 것입니다. 이렇게 하면 문서 관리가 쉬워지고, 동적으로 콘텐츠를 화면에 띄울 수 있습니다.파일 기반 관리문서를 Markdown, HTML, 또는 JSON 파일로 관리하고, 필요할 때 파일을 읽어 화면에 표시합니다.예: docs/ 디렉터리에 각 문서를 저장.import React, { useState, useEffect } from "react";import ReactMarkdown from "react-markdown";import rehypeRaw from "rehype-raw"; // HTML 파싱import rehypeHighlight from "rehype-high.. react router 실행 과정 import React from "react";import { BrowserRouter as Router, Routes, Route } from "react-router-dom";import FileViewer from "./FileViewer";import FileDetail from "./FileDetail";import DocsPage from "./DocsPage"; // 새 문서 페이지import files from "./data";import "./styles/App.css"; // 스타일 추가const App = () => { return ( AI Framework 주요 기능 구현 } /> .. 이전 1 2 3 4 ··· 11 다음
