.
I read Gabby’s article about the brand-new TypeScript/JavaScript job experience in Visual Studio 2022 You need to check out the docs on JavaScript and TypeScript in Visual Studio 2022
If you’re utilized to ASP.NET apps when you think of apps that are JavaScript heavy, “front end apps” or TypeScript focused, it can be puzzling regarding “where does.NET fit in?”
You require to think about the duties of your numerous tasks or subsystems and the several completely legitimate methods you can develop a website or web app. Let’s think about simply a couple of:
- An ASP.NET Web app that renders HTML on the server however utilizes TS/JS
- This might have a Web API, Razor Pages, with or without the MVC pattern.
- You possibly have actually simply included JavaScript by means of << script> > tags
- Perhaps you included a script minimizer/minifier job
- Can be complicated since it can seem like your app requires to ‘develop both the customer and the server’ from one job
- A primarily JavaScript/TypeScript frontend app where the HTML might be served from any web server (node, kestrel, fixed web apps, nginx, and so on)
- This app might utilize Vue or React or Angular however it’s not an “ASP.NET app”
- It calls backend Web APIs that might be served by ASP.NET, Azure Functions, 3rd celebration REST APIs, or all of the above
- This situation has actually in some cases been puzzling for ASP.NET designers who might get puzzled about duty. Who constructs what, where do things wind up, how do I develop and release this?
VS2022 brings JavaScript and TypeScript support into VS with a complete JavaScript Language Service based upon TS. It supplies a TypeScript NuGet Bundle so you can develop your entire app with MSBuild and VS will do the ideal thing.
NEW: Beginning in Visual Studio 2022, there is a brand-new JavaScript/TypeScript job type (. esproj) that permits you to produce standalone Angular, Respond, and Vue tasks in Visual Studio.
The.esproj idea is excellent for folks knowledgeable about Visual Studio as we understand that an Option consists of several Jobs. Visual Studio handles declare a single application in a Job The job consists of source code, resources, and setup files. In this case we can have a.csproj for a backend Web API and an.esproj that utilizes a customer side design template like Angular, Respond, or Vue.
Thing is, traditionally when Visual Studio supported Angular, Respond, or Vue, it’s design templates ran out date and not upgraded enough. VS2022 utilizes the native CLIs for these front ends, resolving that issue with Angular CLI, Produce React App, and Vue CLI
If I remain in VS and go “Submit New Job” there are Standalone design templates that fix Example 2 above. I’ll choose JavaScript React.
Then I’ll click “Include combination for Empty ASP.NET Web API. This will provide me a frontend with javascript all set to call a ASP.NET Web API backend. I’ll follow along here
It then utilizes the React CLI to make the front end, which once again, is cool as it’s whatever variation I desire it to be.
Then I’ll include my ASP.NET Web API backend to the very same option, so now I have an esproj and a csproj like this
Now I have a great tidy 2 job system – in this case more JavaScript concentrated than.NET focused. This one utilizes npm to start-up the job utilizing their web advancement server and proxyMiddleware to proxy localhost:3000 calls over to the ASP.NET Web API job.
Here is a React app served by npm calling over to the Weather condition service served from Kestrel on ASP.NET.
This is inverted than many ASP.NET Folks are utilized to, which’s okay. This reveals me that Visual Studio 2022 can support either advancement design, utilize the CLI that is set up for whatever Frontend Structure, and enable me to pick what web server and web internet browser (by means of Launch.json) I desire.
If you wish to turn it, and put ASP.NET Core as the main and after that generate some TypeScript/JavaScript, follow this tutorial since that’s likewise possible!
Sponsor: Make login Auth0’s issue. Not yours. Supply the hassle-free login functions your clients desire, like social login, multi-factor authentication, single sign-on, passwordless, and more. Get going totally free.
.
.
.
.
About Scott
Scott Hanselman is a previous teacher, previous Chief Designer in financing, now speaker, expert, daddy, diabetic, and Microsoft staff member. He is an unsuccessful comic, a cornrower, and a book author.
.
.
.
.
.
.
.
.
.