2024.11.29 - [ReactFileStructure/App] - 링크에 해당하는 경로 이동
링크에 해당하는 경로 이동
react-router-dom 을 사용하여 경로 처리, 컴포넌트에 대한 설명 페이지 생성라우팅 추가import React from "react";import { BrowserRouter as Router, Routes, Route } from "react-router-dom";import FileViewer from "./FileViewer";import
teach-meaning.tistory.com
2024.11.29 - [ReactFileStructure/DocsPage] - 문서 페이지
문서 페이지
DocsPage 컴포넌트는 URL 파라미터를 읽고, 해당 컴포넌트에 대한 설명을 렌더링한다.import React from "react";import { useParams, Link } from "react-router-dom";const DocsPage = () => { const { componentName } = useParams(); // URL
teach-meaning.tistory.com
2024.11.29 - [ReactFileStructure/FileDetail] - 링크 추가
링크 추가
파일 코드에서 링크가 있는 줄을 클릭하면 해당 문서 페이지로 이동하도록 설정import React from "react";import { useParams, Link } from "react-router-dom";const FileDetail = ({ files }) => { const { fileName } = useParams(); con
teach-meaning.tistory.com
링크에 해당하는 경로 docs/FileViewr 는 추가 설명이나 문서화 페이지를 제공하는 데 사용할 수 있다. 이 경로로 이동했을 때, FileViewer 컴포넌트 또는 파일에 대한 상세 설명이나 API 문서를 보여주도록 구성하면 된다.
'ReactFileStructure' 카테고리의 다른 글
| React, Express 서버 간의 통신 (0) | 2024.12.02 |
|---|---|
| 코드 설명을 위해 코드 내 하이라이트 추가 (2) | 2024.11.29 |