Building a Website with React 16 and ASP.NET Core 2
This course is about building web sites with React and ASP.NET Core. Two different technologies that work really well together. React, the JavaScript single page app framework and ASP.NET Core, the super fast, open source, standards compliant server.
What you'll learn
Do you want to build a fully functioning modern web application that works on client browsers as well as back end REST servers? Do you want to use one of the most popular front end single page app frameworks in the world? In this course, Building a Website with React 16 and ASP.NET Core 2, you will learn the best practices for how to build that app and have it work well with a Microsoft ASP.NET Core server using open source standards. First, you will learn how to create a React app starting with an empty Webpack config file, and from the ground up, build a React solution that talks asynchronously to an ASP.NET Core web server. Then, you will see how to implement server-side rendering using Node on the backend. Finally, you will learn about other options for integrating React and ASP.NET Core, including the create-react-app project from Facebook and the Microsoft React starter templates. By the end of the course, you will be able to build real-world React apps that work with an ASP.NET Core REST server on the back end for data. You’ll have the knowledge and tools you can apply right away to begin writing awesome React apps with ASP.NET Core.
Table of contents
- Introducing Custom Webpack Integration 4m
- Learn the JavaScript Build Tools 5m
- Learn to Work with webpack-dev-server 4m
- Bring in React and Create the First Component 4m
- Adding React Router to the App 3m
- Updating the Example to a Conference Web Site 3m
- Why You Are Not Done and Server Side Rendering 5m
- Splitting the WebPack Config into Two 5m
- Implementing Server Side Render and URL Validation 5m
- Using ReactDOM.renderToString to Generate the Static HTML 6m
- Integrating React with ASP.NET Core 6m
- Summary 3m
- Introducing create-react-app 4m
- Getting Started with create-react-app 5m
- The All Important react-scripts Module 6m
- Learn a Downside of create-react-app 2m
- Adding the SASS CSS Preprocessor to create-react-app 6m
- Convert an Existing React App to create-react-app 5m
- Tightly Coupling create-react-app to ASP.NET Core 3m
- Summary 3m
- Introduction 5m
- Learn About Axios for Making REST Calls 3m
- Implementing Axios for Getting Data on the Speaker Component 5m
- Creating Redux Actions and Reducers for Loading Data 6m
- Learning More About the Redux Speaker Reducer 3m
- Learn How a Redux Action Updates the React Components Data 5m
- Debugging Redux State Changes with Chrome Dev Tools 4m
- Adding JSON Server for REST GETs, PUTs, POSTs, and DELETEs 5m
- Making REST PUT (Update) to the JSON Server 5m
- Adding Sessions, Styling, and Interaction to the Web App 3m
- Implementing Axios for Getting Data on the Speaker Component 5m
- Integrating a Decoupled React Site to ASP.NET Core 4m
- Adding Development Time Only Middleware to React Redux 4m
- Summary 2m
- Introducing Integrating REST Data into Server Side Rendering HTML 5m
- Outlining the Plan for Adding REST Data to Server Rendered HTML 4m
- Replacing Route Elements with Declarative Definitions Using renderRoutes 8m
- Fulfilling Promises in the Node Server 5m
- Syncing Server Side Generated HTML with Client Side JavaScript 5m
- Summary 1m
About the author
Peter is an independent software consultant, specializing in .NET development from 1985 through 2001, as well as an eleven time Microsoft MVP. He was founder and president of Tufden Inc, where he successfully delivered systems for clinic scheduling, insurance company management and medical claim processing. His solutions included delivering a turnkey medical office management system to over 500 customers nationwide. His passion for the computer dates back to elementary school when he joined his ... more