Vytvoření aplikace React

V tomto 5-10minutovém úvodu do integrovaného vývojového prostředí (IDE) sady Visual Studio vytvoříte a spustíte jednoduchou front-endovou webovou aplikaci React.

Požadavky

Nezapomeňte nainstalovat následující:

• Visual Studio 2022 nebo novější Přejděte na stránku pro stažení sady Visual Studio a nainstalujte ji zdarma.
• npm (https://www.npmjs.com/), který je součástí Node.js
• npx (https://www.npmjs.com/package/npx)

Vytvoření aplikace

1. V okně Start (otevření zvolte Okno Spustit soubor>) vyberte Vytvořit nový projekt.

   

2. Na panelu hledání v horní části vyhledejte React a pak vyberte Samostatný projekt React JavaScriptu nebo Samostatný projekt TypeScript React podle vašich preferencí.

   

3. Pojmenujte projekt a řešení.

   Pokud jste dříve vybrali samostatnou šablonu JavaScript Reactu, nezapomeňte, že pokud se dostanete do okna Další informace, nezapomeňte zkontrolovat možnost Přidat integraci pro prázdný ASP.NET projekt webového rozhraní API. Tato možnost přidá soubory do šablony React, aby bylo možné je připojit k projektu ASP.NET Core, pokud se přidá projekt ASP.NET Core.

   

4. Zvolte Vytvořit a počkejte na vytvoření projektu v sadě Visual Studio.

   Upozorňujeme, že vytvoření projektu Reactu chvíli trvá, protože příkaz create-react-app, který se v současné době spouští, spustí také příkaz npm install.

Zobrazení vlastností projektu

Výchozí nastavení projektu umožňuje sestavit a ladit projekt. Pokud ale potřebujete změnit nastavení, klikněte pravým tlačítkem myši na projekt v Průzkumník řešení, vyberte Vlastnosti a pak přejděte do části Sestavení nebo ladění.

Sestavení projektu

Zvolte Sestavit>řešení pro sestavení a sestavte projekt.

Spuštění projektu

Stiskněte klávesu F5 nebo vyberte tlačítko Start v horní části okna a zobrazí se například příkazový řádek:

• VITE v4.4.9 připraveno v 780 ms

Dále by se měla zobrazit základní aplikace React.

Další kroky

Integrace ASP.NET Core: