Frontity Tutorial
  • 👋Welcome
  • ✔️Checking your progress
  • 1️⃣ Creating a custom theme
    • Create a Frontity Project
    • Create a Theme Package
    • Modify the <Root> component
    • Connect the <Root> component to the state
  • 2️⃣ Adding a menu
    • Use the <Link> component
  • 3️⃣ Displaying posts
    • Understanding the Frontity state
    • Display the list of posts
    • Display the post content
    • Display posts and pages separately
    • Formatting the date
  • 4️⃣ Adding styling
    • Global styles
    • Styled components
    • Styling the links
    • Styling the post info
    • Add dynamic styling
  • 5️⃣ Adding behaviour
    • Use 'state' and 'actions'
    • Add pagination
  • 6️⃣ Custom Post Types
    • Add support for Custom Post Types
  • 7️⃣ Finishing touches
    • Add a <Loading> component
    • Add a 404 page
    • Use the <html2react> component
    • SEO and head tags
    • Other things to do
  • 8️⃣ Deploying the project
    • Deploy to Vercel
  • 9️⃣ Next Steps
    • Learning resources
    • Getting help and support
    • Contributing to Frontity
Powered by GitBook
On this page

7️⃣ Finishing touches

We've come a long way. We now have a fully-functional and good-looking website.

In what is the last section of coding before we move on to deploy our finished project, we'll add some refinements and finishing touches that will add a veneer of professionalism to our site.

We'll add a loading indicator (sometimes called a 'spinner') so that the user knows something is happening in the background while data is being fetched from the REST API.

No website is complete without a 404 page. We hope we'll never need it, but we should have one just in case. We'll add one!

We will also take a look at a couple of other components that Frontity provides. Firstly we'll see how we can use the <html2react> component to process our content, and then we'll use the <Head> component to make our site SEO friendly.

We'll round out this section with some ideas and suggestions for more finishing touches that you could add on your own. Don't worry - we'll give you some hints and tips, and show you where you can find more info in the docs.

We're on the home straight...

PreviousAdd support for Custom Post TypesNextAdd a <Loading> component

Last updated 4 years ago