can't assign url ('${api}/item/all') in reactjs

Question

import React, { useEffect, useState } from 'react'
import './MainMenu.css'
import axios from 'axios'
import { api } from "../config";




function MainMenu() {
    const [items, setItems] = useState([]);

    useEffect(()=>{

        const FecthItems = async()=>{
           //const result = await axios.get( api +"/item/all");
           const result = await axios.get('${api}/item/all');
           //console.log(result);
           setItems(result.data);
        };
           FecthItems();
    }, []);

when its working with this -- const result = await axios.get( api +"/item/all"); its not working with --- const result = await axios.get('${api}/item/all');

so please can i know why its not working with ${api}