Chap05 -> Using route parameters -> Adding the question page route (Finished)

QandA/frontend/src/Question.tsx

@@ -1,8 +1,9 @@
 /** @jsxImportSource @emotion/react */
 import { css } from '@emotion/react';
-import { gray2, gray3 } from './Styles';
+import { Link } from 'react-router-dom';
-
 import React from 'react';
+
+import { gray2, gray3 } from './Styles';
 import { QuestionData } from './QuestionsData';
 
 interface Props {
@@ -18,7 +19,15 @@ export const Question = ({ data, showContent }: Props) => (
         font-size: 19px;
       `}
     >
-      {data.title}
+      <Link
+        css={css`
+          text-decoration: none;
+          color: ${gray2};
+        `}
+        to={`/questions/${data.questionId}`}
+      >
+        {data.title}
+      </Link>
     </div>
     {showContent && (
       <div

QandA/frontend/src/QuestionPage.tsx

@@ -1,4 +1,9 @@
 import React from 'react';
+import { useParams } from 'react-router-dom';
+
 import { Page } from './Page';
 
-export const QuestionPage = () => <Page>Question Page</Page>;
+export const QuestionPage = () => {
+  const { questionId } = useParams();
+  return <Page>Question Page {questionId}</Page>;
+};