Back-End Development

How To Set Up .NET Core Web App With React & TypeScript

Place Of Work

If you are trying to build a .NET Core Web Application with React.js, there is a template that you can create your project with in Visual Studio. However, if you want to incorporate Typescript in your application, there are a few extra steps that you have to take. This blog post is possible thanks to Josh Kostal.

 

Create your .NET Core Web Application with the React.js template.

Bp10 1

Bp10 2

Once you create the project, head over to Visual Studio Code and open the folder containing the project. Right-click the ClientApp folder and delete it.

Covid 19
COVID-19: Digital Insights For Enterprise Action

Access Perficient’s latest insights into how you can leverage digital technologies to not only respond to the pandemic, but drive your operations forward and deliver experiences your customers need.

Get Informed

Bp10 3

Open up a new terminal.

Bp10 4

Step into the sub-folder by doing a ‘cd <name of your folder>’. Enter ‘npx create-react-app my-app –template typescript‘ to create your react application with typescript.

Bp10 5

You may delete these files at your discretion:

  • src/setupTests.ts
  • src/App.test.tsx
  • src/Index.css
  • WeatherForecast.cs
  • WeatherForecastController

Remove those lines that import any of the files deleted above.

Bp10 6

Step into the react app and ‘npm install –save bootstrap to install bootstrap. Click here for a reference.

Bp10 7

Now you can run ‘npm start’ to open up your application in your localhost!

About the Author

David Hwang is an Associate Technical Consultant in the Sitecore/Microsoft Business Unit. He will be blogging about various concepts in technologies for beginners.

More from this Author

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Subscribe to the Weekly Blog Digest:

Sign Up