This is the next in a series of blog posts that will cover the topics discussed in the ASP.NET Community Standup. The community standup is a short video-based discussion with some of the leaders of the ASP.NET development teams covering the accomplishments of the team on the new ASP.NET Core framework over the previous week. Within 30 minutes, Scott Hanselman, Damian Edwards, Jon Galloway and an occasional guest or two discuss new features and ask for feedback on important decisions being made by the ASP.NET development teams.
Each week the standup is hosted live on Google Hangouts and the team publishes the recorded video of their discussion to YouTube for later reference. The guys answer your questions LIVE and unfiltered. This is your chance to ask about the why and what of ASP.NET! Join them each Tuesday on live.asp.net where the meeting’s schedule is posted and hosted.
This week’s meeting is below:
This week, Scott is coming to us from the DotNetFringe conference in Portland where they evidently placed him in a dark room. Jon Galloway couldn’t make it to the standup this week, so there are no links to share. Today’s guest is Steve Sanderson, a member of the ASP.NET team for the last 6 months or so and is a founder of the KnockoutJS project. He’s been investigating using JavaScript frameworks to help improve ASP.NET Core. Steve’s project is called ASP.NET JavaScript services and can be found on GitHub.
The project gives you a good starting point for building web applications using various JavaScript frameworks. In particular, there are yeoman templates available for Angular 2 Knockout, React, and React with Redux. You can acquire the templates in a shell with the command :
npm install -g yo generator-aspnetcore-spa
This will allow you to generate a base-project with the command:
yo aspnetcore-spa
Steve showed us the Angular 2 version of this template, walked through the structure and configuration of the Angular code working with ASP.NET Core. The template’s TypeScript is built and managed with WebPack and Steve showed us the advantages of this toolset combined with ASP.NET Core. Additionally, Steve enabled hot-module reloading within the configuration of the ASP.NET Core application and his application was updated live in the browser as TypeScript code was saved within his application.
Steve then showed us a second configuration option that uses NodeJS to precompile the JavaScript application that is then served by the Kestrel server as static content and without the Angular framework. This prerender configuration is enabled with an asp-prerender-module tag helper attribute, which Steve tells us is enabled by default in his project template.
Then Steve showed us the ReactJS enabled project template that comes with the Yeoman generator we installed above. The template outputs the same demo functionality and user-interface, except it was written with ReactJS and TypeScript. As a bonus feature to this sample, and a feature of React, this sample can persist its page state across browser state. This enables a great JavaScript development experience where you can edit content directly in the developer tools panel of the browser and the content panel will update appropriately.
Finally, Steve showed us the React-Redux template that was installed and how you can use the redux browser plugin to make debugging much easier with snapshots of your client-side application state made available in your browser.
Summary
Please download the JavaScript services and follow the instructions from the GitHub repository and let us know what you think. If you like this project, star it on GitHub and write about it on your own blog. Post your questions as issues in that GitHub repository and we’ll review them to determine how we should proceed with this work. Steve also has a great post introducing the project on his blog that you should check out. We would love to hear your thoughts about this approach in the space below, and we’ll be sure that Steve and his team see your comments.