2. String and Date Manipulation, Bootstrap Card Component

In this tutorial we walk you through how to make your React JS front end look great by implementing Bootstrap 4. We’ll also demonstrate how we can instantly filter items on the front end.

This tutorial is part 2 of How to Develop a Detached DNN Front End with React JS where we began the creation of a Movie library... administered in the DNN backend, but displayed on an entirely detached React JS front end via a REST API developed with the 2sxc module.

React.js was developed by Facebook and is at the cutting edge of front end development, and it’s quickly becoming the industry standard javascript library of choice worldwide.

2SXC is a fantastic module allowing us to turn DNN into a decent content management system. Recent new features allow us to visually build REST API routes.

This video contains:

• Implementing the bootstrap 4 container and row for responsivity
• Reactifying the Bootstrap card component
• How to turn a DNN relative URL into an absolute URL in React
• About React and XSS cross site scripting rules
• How to convert a 2sxc field
• How to parse and display an ISO format date with Javascript
• Adding a Bootstrap card footer
• Adding the card star rating