typescript,expressでの簡単なサーバーへのリクエストテストでのエラー

実現したいこと

■クライアントサイド(ionic/angular)
「GETリクエストを送信」をボタンを押すと、サーバーにGetリクエストがされ、サーバーから「hello world」というレスポンスを受け取る。

■サーバーサイド(express)
クライアントサイドからのGetリクエストに、「hello world」というレスポンスを行う。

前提

ここに質問の内容を詳しく書いてください。
（例）

■質問

TypeScriptで簡単なサーバー応答確認プログラムを作っています。
その際エラーが出てしまいました。原因を教えてください。
クライアントサイドのURLや、サーバーサイドのエンドポイントの設定がおかしいのでしょうか？

発生している問題・エラーメッセージ

■エラーメッセージ

GET http://localhost:3000/api/hello 404 (Not Found)
sendGetRequest	@	home.page.ts:32
HomePage_Template_ion_button_click_5_listener	@	home.page.html:11
Zone - HostElement.addEventListener:click (async)		
HomePage_Template	@	home.page.html:11
Zone - Promise.then (async)		
(anonymous)

該当のソースコード


■クライアントサイド
●home.page.ts:
@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {
  user: any;
  errorMessage: string = '';
  audioFile: any;
  imageFile: any;
  videoFile: any;

  response: string = '';

  constructor(private afAuth: AngularFireAuth, private router: Router
      , private http: HttpClient) {
    this.afAuth.authState.subscribe((user) => {
      if (user) {
        this.user = user;
      } else {
        this.router.navigate(['/login']);
      }
    });
  }
// postリクエストのテスト用
  sendGetRequest() {
  this.http.get<any>('http://localhost:3000/api/hello').subscribe(
    (data) => {
      this.response = data;
    },
    (error) => {
      console.error('GETリクエストが失敗しました。', error);
    }
  );
}

■サーバーサイド

●app.ts:
import express from 'express';
import bodyParser from 'body-parser';
import cors from 'cors';
import multer from 'multer';
import mediaRoutes from './routes/media.routes';
import helloRoutes from './routes/hello.routes';

const app = express();
const PORT = process.env.PORT || 3000;

// multerの設定
const storage = multer.diskStorage({
destination: (req, file, cb) => {
cb(null, 'uploads/');
},
filename: (req, file, cb) => {
cb(null, file.originalname);
},
});

const upload = multer({ storage });

app.use(bodyParser.json());
app.use(cors());
app.use(upload.fields([{ name: 'audio', maxCount: 1 }, { name: 'image', maxCount: 1 }]));

// エンドポイントのルーティング
app.use('/api/media/createVideo', mediaRoutes);
app.use('/api/hello', helloRoutes);

app.listen(PORT, () => {
console.log(Server is running on port ${PORT});
});

●hello.routes.ts:
import express, { Router, Request, Response } from 'express';

const router: Router = express.Router();

console.log("hello.routes.tsが呼び出されました")

// "hello world"をクライアントに返すエンドポイント（POSTリクエスト）
router.get('/hello', (req: Request, res: Response) => {
console.log("hello worldを返します")
res.send('hello world');
});

export default router;